问一个关于继承的问题

2018-04-02 08:33:05 +08:00
 waiaan

function extend(subClass,superClass){

var F = function(){};

F.prototype = superClass.prototype;

subClass.prototype = new F();

subClass.prototype.constructor = subClass;

// 下面这段代码,为什么要赋值为 superClass.prototype ?可不可以直接赋值为 superClass ?二者有什么区别?

subClass.superClass = superClass.prototype;

// 

if(superClass.prototype.constructor == Object.prototype.constructor){

	superClass.prototype.constructor = superClass;

}

}

谢谢。

3074 次点击
所在节点    JavaScript
3 条回复
WMutong
2018-04-02 09:44:34 +08:00
完整的继承:

var SuperClass=function(){
this.name='superClass';
};
SuperClass.prototype.sayName=function(){
console.log('name: ' + this.name);
};

var SubClass=function(){
SuperClass.call(this,name);
};

function extend(subClass,superClass){

var F = function(){};

F.prototype = superClass.prototype;

subClass.prototype = new F(); //位置一

subClass.prototype.constructor = subClass;

// 下面这段代码,为什么要赋值为 superClass.prototype ?可不可以直接赋值为 superClass ?二者有什么区别?

subClass.superClass = superClass.prototype; //位置二

//

if(superClass.prototype.constructor == Object.prototype.constructor){

superClass.prototype.constructor = superClass;

}
}

extend(SubClass,SuperClass);

var sub1=new SubClass();
console.log(sub1); //位置五
sub1.sayName();

例子中,位置五( sub1 实例)输出:

SubClass{
name:"superClass",
__proto__:{
constructor:function(){
superClass:Object, //SuperClass 的构造函数
...
prototype:SuperClass //SuperClass 的构造函数
}
}
}

如果没有“ subClass.superClass = superClass.prototype;”,那么 位置五 输出:

SubClass{
name:"superClass",
__proto__:{
constructor:function(){
...
prototype:SuperClass //SuperClass 的构造函数
}
}
}

两者的区别在于:
一个是在 SubClass 构造函数中添加了,等于 SuperClass 原型的 superClass 属性。
一个没有添加。

但不论 位置二 是否存在,SubClass 都已经在 位置一 继承了 SuperClass 的原型方法。
所以,我认为 位置二 并不是必要的。


同时《 JavaScript 高级程序设计 第三版》中对于 “寄生组合式继承” 使用的示例为:

function inheritPrototype(subClass,superClass){

var prototype=object(superClass.prototype);
prototype.constructor=subClass;
subClass.prototype=prototype;

}
waiaan
2018-04-02 10:31:32 +08:00
@WMutong
不好意思,我没表述清楚,位置二并不是继承的一部分,只是在子类增加一个指向父类的属性,但是并不是直接指向父类的构造函数,而是指向父类的原型,所以我想问这两者有什么区别。
谢谢。
enginex
2018-04-02 15:02:11 +08:00
subClass.superClass = superClass.prototype;// 位置二
console.log(SubClass.superClass.sayName); //ƒ (){console.log('name: ' + this.name);}

subClass.superClass = superClass ;//位置二
console.log(SubClass.superClass.sayName); //undefined

父类构造函数上并没有 sayName 方法,这里调用是通过原型链实现的

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/443441

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX