财产影子问题

Question

我正在学习JS。 凯尔·辛普森 (Kyle Simpson) 在他的书 YDKJS 中写道：

如果在 [[Prototype]] 链上 Prototypes 244 更高的任何地方找到一个名为 foo 的普通数据访问器（参见第 3 章）属性，并且它没有被标记为只读（writable:true） ，那么一个名为 foo 的新属性将被直接添加到 myObject，导致阴影属性。

function Foo(name) {
this.name = name;
}
Foo.prototype.myName = function() {
return this.name;
};
var a = new Foo( "a" );
var b = new Foo( "b" );

在上面的代码片段中，很容易想到当 a 和 b 创建时， Foo.prototype object 上的属性/函数被复制到每个 a 和 b 对象。 然而，事实并非如此。 当分别在 a 或 b 上找不到myName时，它会在 Foo.prototype 上找到（通过委托，参见第 6 章）。 参考第 97 页

为了进行相同的测试，我在原型 object 上创建了一个值为 1 的属性val ：

Foo.prototype.val = 1;

由于 object a是原型链接的，因此我将此属性递增 1：

a.val++;

但是当我执行以下两行时：

console.log(a.val);   
console.log(Foo.prototype.val);   

结果：

2
1

结果表明，在object a上创建了一个单独的属性val ，其增量值为 2，这似乎与他的声明相矛盾（即委托）。

我哪里误入歧途了？ 请指导

Answer 1

我认为您可能会混淆分配值时与使用构造函数 function 创建 object 时原型上的值会发生什么。

例如，以本书的第一个例子为例：

Foo.prototype.myName = function() {...};
var a = new Foo( "a" );
var b = new Foo( "b" );

正如 Kyle 在他的书中概述的那样，当使用new关键字创建对象a和b时， Foo.prototype中的值不是直接在a和b上创建为属性（即：自有属性），而是a和b的[[Prototype]]指向Foo.prototype ，这是访问myName的地方。

在您的示例代码中，您首先在原型上创建一个名为val的属性：

Foo.prototype.val = 1;

然后递增val 。 这个增量就是随后a . 为了更详细地展示正在发生的事情，开始执行以下操作：

 v--- creates an own-property directly on `a` 
a.val = a.val + 1;
         ^--- accessing 1 from `Foo.prototype.val`

上面的a.val =组件直接在a object 上创建了一个名为val的自己的属性，而a.val + 1正在访问您之前使用Foo.prototype.val = 1; 通过[[Prototype]]访问a ，然后将其加1 。 当您在这里有效地进行“分配”时，您最终会在a上创建一个自己的属性，这与 Kyle 书中摘录的操作不同，他只是使用new关键字创建一个新的 object .