javascript - 为什么子类型必须在子类型的功能之外为其原型分配父级？

Question

如果我在我的函数中为我的子类型的原型分配一个父级，我的子类型的原型最终会指向 Subtype 而不是 SuperType。为什么是这样？

function SubType( name ){
}               
SubType.prototype = new SuperType(); 

 // THE ABOVE WORKS :)

 function SubType(){
        SubType.prototype = new SuperType(); 
 }   

// THE ABOVE DOESN'T WORK :(

Answer 1

这是因为new运算符在 JavaScript 中的工作方式。当您new在函数调用之前使用时，会发生以下情况：

1. 我们从函数的 中创建一个新对象prototype（例如var instance = Object.create(func.prototype)）。
2. 我们将this函数的指针设置为新创建的对象（例如var result = func.apply(instance, arguments)）。
3. 如果结果不是对象或函数，我们将返回实例（例如if (typeof result === "object" || typeof result === "function") return result; else return instance;）。

现在忘记其他一切，只关注第一点——实例对象创建阶段。

示例 1：

function SubType(name) {
}

SubType.prototype = new SuperType;

// THE ABOVE WORKS :)

在这里，我们将prototypeofSubType设置new SuperType在构造函数之外。因此，当您调用JavaScript 时，会创建一个继承自当时new SubType的新对象。因此，实例也继承自。SubType.prototypenew SuperTypeSuperType

示例 2：

function SubType() {
    SubType.prototype = new SuperType;
}

// THE ABOVE DOESN'T WORK :(

new SubType在我们设置SubType.prototype为之前，我们在这里调用new SuperType。SubType.prototype 因此，实例对象继承自它被设置为new SuperType. 因此该实例不继承自SuperType.

结论：

要了解继承在 JavaScript 中的工作原理，我建议您阅读以下文章：

1. JavaScript继承和构造函数属性 - 代码日志
2. 没有办法在 javascript 中拥有基于类的对象？- 堆栈溢出
3. javascript - 原型继承优于经典的好处？- 堆栈溢出
4. 阿迪特 M 沙阿 | 为什么原型继承很重要

Answer 2

将它放在prototype构造函数中会在创建每个实例时重置它new，但还需要您创建至少 1 个实例以使其继承。

function SubType(){
    SubType.prototype = new SuperType(); 
}

var before = SubType.prototype;
new SubType();

console.log(before === SubType.prototype);  // false

var current = SubType.prototype;
new SubType();

console.log(before === SubType.prototype);  // false
console.log(current === SubType.prototype); // false
console.log(before === current);            // false

继承通常应该在创建任何实例之前建立，这需要在构造函数之外prototype设置链：

function SubType() {}
SubType.prototype = new SuperType();

var before = SubType.prototype;

new SubType();

console.log(before === SubType.prototype); // true

Answer 3

因为您只在第二种情况下定义了 SubType，所以您还没有执行函数 SubType。

function SubType( name ){
}               
SubType.prototype = new SuperType(); 

 // THE ABOVE WORKS :)

 function SubType(){
        SubType.prototype = new SuperType(); 
 }   

 SubType();

// THE ABOVE WILL WORK NOW