Question

我正在学习JavaScript原型，想问你下面的代码是否正确：

function Shape() {
    Shape.prototype.duplicate = function() {
        console.log('Duplicate');
    }
}

function Circle() {
    Circle.prototype = Object.create(Shape.prototype);
}

或者我应该使用以下代码：

function Shape() {
}

Shape.prototype.duplicate = function() {
    console.log('Duplicate');
}

function Circle() {
}

Circle.prototype = Object.create(Shape.prototype);

Answer 1

tl; dr：应该在构造函数的外部初始化原型。

prototype对象仅应一次初始化/创建。在构造函数中对其进行更改意味着每次创建新实例时，都会以一种或另一种方式更改原型。

这种方式破坏了原型的目的，因为它们应该是原型，并且可以在所有实例之间共享（以“保存”内存）。

对于Shape来说不是很明显，但是对于Circle来说则更加明显：

function Shape() {
    Shape.prototype.duplicate = function() {
        console.log('Duplicate');
    }
}

function Circle() {
    Circle.prototype = Object.create(Shape.prototype);
}

var c1 = new Circle();
var c2 = new Circle();

console.log(
  Object.getPrototypeOf(c1) === Object.getPrototypeOf(c2),
  ':-O every Circle instance has its own prototype'
);

c1.duplicate();
// can't even call `c1.duplicate` because 
// `Circle.prototype = Object.create(Shape.prototype);` happens 
// *after* the first instance was created

在JavaScript中正确使用原型

1 个答案: