Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >我对javascript原型继承的误解

我对javascript原型继承的误解
EN

Stack Overflow用户
提问于 2010-12-22 05:32:36
回答 2查看 180关注 0票数 3

简单的问题。

代码语言:javascript
运行
AI代码解释
复制
    function p()
    {
        function A()
        {
            this.random = "random";
        }
        A.prototype.newfunc = function(){ alert("5");}

        function B()
        {

        }

        B.prototype = new A();

        var bObj = new B();
    }

Q1:当我设置B的prototype时,我不知道当/如果A的prototype更新时,B的prototype属性将如何更新。我的意思是,对我来说,它只是继承/复制所有这些属性。这并不是说:

代码语言:javascript
运行
AI代码解释
复制
B.prototype = A.prototype

其中B和A是同一个。

Q2:在A被返回并初始化到B的prototype对象之后,JS如何知道不包含该prototype属性?我的意思是,我们从来没有发生过这种情况,因为JS解释器知道只是为了砍掉A的原型的属性:

代码语言:javascript
运行
AI代码解释
复制
B.prototype = new A(); //any A object has an associated prototype object
    B.prototype.prototype;//after initialization we no longer have the separate prototype property of A
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2010-12-22 06:53:36

Q1:你自己也说过- prototype是用于继承的。因此,B继承了A的所有属性。当您添加或更改A的成员时,B也将更改。正如您所说的,它们并不相同,但A是B的超类,如果超类中的任何内容发生变化,那么子类也会发生变化。不过,您可以向B.prototype添加成员并更改其行为,而无需更改A。

试试这个:

代码语言:javascript
运行
AI代码解释
复制
    function A()
    {
    }

    A.prototype.alertname = function () 
    {
        alert (this.name);
    };

    function B()
    {
    }

    B.prototype = new A();

    var bObj = new B();
    var aObj = new A();

    A.prototype.name = "A"; 
    aObj.alertname(); // output is "A";
    bObj.alertname(); // output is "A";

    B.prototype.name = "B";
    aObj.alertname(); // output is "A";
    bObj.alertname(); // output is "B";

Q2:同样,继承不同于组合。当你赋值B.prototype时,你不只是把一个A类型的对象放在一个占位符里,还会改变所有B类型对象的“蓝图”。所以当你访问这个蓝图时,你得到的不是一个A类型的对象,而是一个B类型的蓝图,它包含对A类型蓝图的引用。这个蓝图不会有prototype类型的成员,因为prototype不是任何一个类的“常规”成员。将此代码添加到上面的代码中:

代码语言:javascript
运行
AI代码解释
复制
function iterateMembers ( obj ) {
    var str = "";
    for (var member in obj) {
        str += member + ", "
    }
    alert (str);
}

iterateMembers (aObj);
iterateMembers (A.prototype); 

注意aObj和A.prototype都不包含成员"prototype“。现在呼叫

代码语言:javascript
运行
AI代码解释
复制
iterateMembers (A);
alert (typeof(A));

现在应该很明显了,prototype是类型function的成员,而且由于function既不是A也不是B继承的(事实上,它不能被继承),所以它们都不包含名为"prototype“的成员。

票数 2
EN

Stack Overflow用户

发布于 2010-12-22 07:52:21

Q1:当我设置B的prototype时,我不知道当/如果A的prototype更新时,B的prototype属性将如何更新。我的意思是,对我来说,它只是继承/复制所有这些属性。

Function对象有一个prototype字段:

代码语言:javascript
运行
AI代码解释
复制
function A(name) { this.name = name }

print(A.prototype) // [object Object]

使用new A创建对象时,结果对象包含一个constructor字段,该字段是对构造函数的引用:

代码语言:javascript
运行
AI代码解释
复制
var a = new A('Eric')

print(a.constructor == A) // True
print(a.constructor.prototype == A.prototype) // True

如果您尝试对a进行索引,但该字段未定义,JavaScript将尝试通过a的原型(例如a.constructor.prototype)来解析它。我们可以使用此方法向所有A实例添加内容:

代码语言:javascript
运行
AI代码解释
复制
A.prototype.greet = function() { print('Hi, ' + this.name + '!') }

a.greet() // Hi, Eric!

此字段解析以递归方式工作。

代码语言:javascript
运行
AI代码解释
复制
function B(name) { this.name = name.toUpperCase() }
B.prototype = new A
b = new B("Eric")
b.greet() // Hi, ERIC!

在最后一行中发生的事情是,JavaScript在b中没有找到'greet‘字段,所以它尝试b的原型,也没有找到它,所以它尝试*b的原型,依此类推,直到它用完了原型。

解释器只知道去掉A的原型的属性: B.prototype.prototype

没有任何东西被砍掉,你只是看错了东西。您需要:

代码语言:javascript
运行
AI代码解释
复制
B.prototype.constructor.prototype
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/4506456

复制
相关文章
对Javascript 类、原型链、继承的理解
  和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承。(以下不讨论ES6中利用class、extends关键字来实现类和继承;实质上,ES6中的class、extends关键字是利用语法糖实现的)
smy
2019/02/13
6890
对Javascript 类、原型链、继承的理解
javascript原型链继承
function user(names,age,jobs){ if(this instanceof user){ this.names=name; this.age=age; this.jobs=jobs; } else{ return new user(name,age,jobs) } } admin.prototype=new user(); function admin(namek,pass){ user.call(this,'jcomey','28','de
2021/11/08
6190
JavaScript原型与继承
对于使用过基于类的语言 (如 Java 或 C++) 的开发人员来说,JavaScript 有点令人困惑,因为它是动态的,并且本身不提供一个 class 实现。(在 ES2015/ES6 中引入了 class 关键字,但那只是语法糖,JavaScript 仍然是基于原型的)。
用户1428723
2020/08/06
5510
JavaScript原型链继承
在JavaScript中,每个对象都有一个原型(prototype),原型本身也是一个对象。当我们访问一个对象的属性或方法时,如果该对象本身没有该属性或方法,JavaScript会自动去它的原型对象中查找。如果原型对象也没有找到,JavaScript会继续在原型对象的原型上查找,这样形成了一个原型链。
堕落飞鸟
2023/05/17
4140
Javascript 组合继承 原型链继承 寄生继承
该继承通过构造函数继承原型链的方法和父类的属性,但该方法会有两次调用父类,第一次是在继承原型链,第二次在继承属性。
菜的黑人牙膏
2019/01/21
1.1K0
JavaScript继承与原型链
当谈到继承时,JavaScript 只有一种结构:对象。每个实例对象(object)都有一个私有属性(称之为 __proto__)指向它的构造函数的原型对象(prototype)。该原型对象也有一个自己的原型对象(__proto__),层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。
Andromeda
2023/10/21
1780
JavaScript继承与原型链
JavaScript继承和原型链
JS在加载构造函数时,会在内存中生成一个对象,这个对象称为函数的原型对象(prototype)。
前端航航
2022/11/11
4610
JavaScript原型链与继承
只要是对象,一定有原型对象,就是说只要这个东西是个对象,那么一定有proto属性。(错的)
用户7043603
2022/02/26
1.6K0
关于 JavaScript 原型和继承的思考
闭包和原型 prototype 工厂函数 function user(name){ var newUser = {}; newUser.name = name; return newUser; } 复制代码 构造函数 //使用new的是 构造函数 function User(name,age,gender){ this.name = name ; this.age = age ; this.gender = gender ; } var whh = new
西南_张家辉
2021/02/02
3700
Javascript的原型继承,说清楚
     一直以来对Javascript的原型、原型链、继承等东西都只是会用和了解,但没有深入去理解这门语言关于继承这方面的本质和特点。闲暇之余做的理解和总结,欢迎各位朋友一起讨论。 本文本主要从两段代码的区别说明继承: 一、第一段代码: function Parent(){ this.Name='parent'; } Parent.prototype.getName = function(){ return this.Name; } Parent.prototype.Share = [
sam dragon
2018/01/17
5500
Javascript的原型继承,说清楚
如果使用 JavaScript 原型实现继承
在这篇文章中,我们将讨论原型以及如何在 JS 中使用它们进行继承。我们还将会看到原型方法与基于类的继承有何不同。
前端小智@大迁世界
2020/05/12
7090
如果使用 JavaScript 原型实现继承
JavaScript原型链继承与盗用构造函数继承
继承这个词比较容易理解,很多东西我们没有,但是我们的父亲有,我们就可以拿我们父亲的来用。这个就是继承。我们直接上干货。
大熊G
2022/11/14
4400
【说站】javascript原型链继承的实现
以上就是javascript原型链继承的实现,希望对大家有所帮助。更多Javascript学习指路:Javascript
很酷的站长
2022/11/23
3780
【说站】javascript原型链继承的使用
2、原型链继承非常适合不需要单独创建构造函数的场合,当仍然需要在对象之间共享信息时。
很酷的站长
2022/11/23
3330
【说站】javascript原型链继承的使用
【说站】JavaScript原型继承的实现方式
1、定义新的构造函数,并在内部使用call()调用希望继承的结构函数,绑定this。
很酷的站长
2022/11/24
2600
【说站】JavaScript原型继承的实现方式
一图弄清JavaScript的继承与原型
其中Function、Object是JavaScript的内建类,JavaScript的类实际上是一个function
我不是码神
2022/07/28
1860
《现代Javascript高级教程》JavaScript中的原型与继承
JavaScript是一门支持面向对象编程的语言,它的函数是第一公民,同时也拥有类的概念。不同于传统的基于类的继承,JavaScript的类和继承是基于原型链模型的。在ES2015/ES6中引入了class关键字,但其本质仍然是基于原型链的语法糖。
linwu
2023/07/27
2630
《现代Javascript高级教程》JavaScript中的原型与继承
详解JavaScript的继承和原型链(prototype)
JavaScript 的每个实例对象都有一个指向上一层对象的私有属性(称之为 __proto__) ,上一层对象又指向再上一层对象,就这样层层向上直至 __proto__ 属性为 null ,最后这个对象就是 Object 。
Learn-anything.cn
2021/12/22
5530
JavaScript学习笔记022-原型链0原型继承0对象的深浅拷贝extends
Author:Mr.柳上原 付出不亚于任何的努力 愿我们所有的努力,都不会被生活辜负 不忘初心,方得始终 这几天一直在做node项目实训 学到了很多实际企业开发知识 学的东西 跟要运用起来的东西 就好像教会你1+1=2 然后让你做高等代数 还需要加倍的努力啊 兄弟 <!DOCTYPE html> <!-- 文档类型:标准html文档 --> <html lang='en'> <!-- html根标签 翻译文字:英文 --> <head> <!-- 网页头部 --> <meat charset='UTF
Mr. 柳上原
2018/09/05
4190
动图学 JavaScript 之:原型继承
你是否曾思考为什么我们能使用 JS 中的一些内置属性和方法,比如 .length,.split(),.join()?我们并没有显式地声明它们,那么究竟它们从哪里来的呢?可不要说什么“那是 JS 中的魔法!”。其实这些都因为一个叫做 原型继承(prototypal inheritance) 的东西。它太棒啦,你平时也经常会用到,只不过可能没有注意!
savokiss
2020/02/18
5820
动图学 JavaScript 之:原型继承

相似问题

对JavaScript继承/原型感到困惑

10

对原型继承Javascript感到困惑

216

Phantomjs javascript继承误解

17

JavaScript对基于原型的继承的限制?

24

原型继承javascript

16
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档