object.create如何在JavaScript中工作？ [英] How does object.create work in JavaScript?

问题描述

告诉我，如果我错了：

原型是一个普通的对象。当一个对象继承原型时，它不仅仅复制原型的属性，该对象存储对原型的引用。

A prototype is a normal object. When an object inherits a prototype, it does not just copy the properties of the prototype, the object stores a reference to the prototype.

在Firefox中，我可以这样做： / p>

In Firefox, I can do:

var food = {fruit:"apple"};
var more_food = {vegetable:"celery"};
food.__proto__ = more_food;
food.vegetable // celery
food.fruit // apple

I可以使用 __proto __ 属性手动设置对原型对象的引用。

I can use the __proto__ property to manually set the reference to the prototype object.

我也可以使用 Object.create ：

var food = {fruit:"apple"};
var more_food = {vegetable:"celery"};
food = Object.create(more_food);
food.vegetable // celery
food.fruit // undefined

什么究竟是 Object.create 在做什么？变量food是否分配了对原型more_food的引用，或者是Object.create只返回对象的副本more_food？如果 Object.create 只是制作副本，那么如果变量食物没有引用more_food，原型链如何工作？

What exactly is Object.create doing? Is the variable food assigned the reference to the prototype more_food, or is Object.create just returning a copy of the object more_food? If Object.create is just making a copy, then how does the prototype chain work if the variable food has no reference to more_food?

推荐答案

原型是普通对象。当一个对象继承原型时，它不只是复制原型的属性，该对象存储对原型的引用。

A prototype is a normal object. When an object inherits a prototype, it does not just copy the properties of the prototype, the object stores a reference to the prototype.

你是对的，一个对象的原型，只是通过原型链引用的另一个对象。

You're right, the prototype of an object, is just another object referenced through the prototype chain.

你的两个片段之间的区别在于 __ proto __ 您变异 food 的原型。在第二个示例中，您只是分配一个继承自 more_food 的新对象，这就是为什么 food.fruit 已解决的原因到 undefined ，因为原来的 food 对象在该作业中丢失了。

The difference between your two snippets is that with __proto__ you are mutating the prototype of food. In your second example, you are just assigning a new object that inherits from more_food, that's why food.fruit is resolved to undefined, because your original food object is lost by that assignment.

Object.create究竟在做什么？

What exactly is Object.create doing?

Object.create 构建一个新对象，它继承自作为第一个参数传递的对象（它只能是一个对象或 null ）。

Object.create builds a new object that inherits from the object passed as its first argument (it can be only either an object or null).

变量food是否分配了对原型more_food的引用，或者是Object。创建只返回对象的副本more_food？

Is the variable food assigned the reference to the prototype more_food, or is Object.create just returning a copy of the object more_food?

您的 food 变量将持有一个新对象，它继承自 more_food ，此操作中没有任何复制。

Your food variable will hold a new object, which inherits from more_food, there's no any copying in this operation.

例如：

var food = {fruit:"apple"};
var more_food = Object.create(food, {
  vegetable: { value: "celery" }
});

more_food.fruit;     // "apple"
more_food.vegetable; // "celery"

在上面的例子中， more_food 继承自 food ，换句话说， food 是 more_food <的原型，此原型引用存储在名为 [[Prototype]] 的内部属性中。 Object.create 的第二个参数允许您初始化此新对象的属性。

In the above example, more_food inherits from food, in other words, food is the prototype of more_food, this prototypical reference is stored in an internal property called [[Prototype]]. The second argument of Object.create allows you to initialize properties on this new object.

没有复制，它是在上面的示例中只是简单的委托 more_food.fruit 可通过原型链访问，属性查找过程非常简单，如果属性不是在一个对象上找到它，再次在对象的原型上再次查找（委托！），直到找到一个原型为 null 的对象（如 Object.prototype ）。

There's no copying, it's just plain delegation in the above example more_food.fruit is accesible through the prototype chain, the property lookup process is really simple, if a property is not found on an object, it's looked up again (delegation!) on the object's prototype, recursively, until an object whose prototype is null is found (like Object.prototype).

因此， more_food.fruit 是一个继承的属性：

So, more_food.fruit is an inherited property:

more_food.hasOwnProperty('fruit'); // false, inherited
'fruit' in more_food;              // true

虽然蔬菜是拥有属性 more_food ：

more_food.hasOwnProperty('vegetable'); // true

上面的例子看起来像这样：

The above example looks graphically like this:

  +---------------------+  [[Prototype]]  +---------------+
  | more_food           |+--------------->| food          |
  |---------------------|                 |---------------|
  | vegetable: "celery" |                 | fruit: "apple |
  +---------------------+                 +---------------+

如果Object.create只是制作副本，那么如果变量食物没有引用more_food，那么原型链如何工作？

If Object.create is just making a copy, then how does the prototype chain work if the variable food has no reference to more_food?

Object.create 不创建对象的副本，它只是设置在创建新对象的原型时。

Object.create doesn't create copies of objects, it just sets up the prototype of a new object at the time of its creation.

请记住 __ proto __ 是一个非标准功能，它将来会从实现中删除，已经在已弃用 ：//developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/Proto\"rel =noreferrer> Mozilla文档，主要原因，这也是为什么语言可能永远不会有以 __ proto __ 的方式改变原型链的方法允许你在o级别引起优化和安全问题f VM和JIT。

Keep in mind that __proto__ is a non-standard feature and it's going to be removed from implementations in the future, is already being listed as deprecated on the Mozilla Documentation, the main reason of this, and it's also why the language may never have a way to mutate the prototype chain in the way __proto__ allows you is that it causes optimization and security problems, at the level of VM and JIT.

这篇关于object.create如何在JavaScript中工作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！