__proto__与constructor.prototype有何不同？

Question

function Gadget(name, color)
{
   this.name = name;
   this.color = color;
}

Gadget.prototype.rating = 3

var newtoy = new Gadget("webcam", "black")

newtoy.constructor.prototype.constructor.prototype.constructor.prototype 

它总是返回rating = 3的对象.

但如果我做以下事情:

newtoy.__proto__.__proto__.__proto__

链条最终返回null.

另外在Internet Explorer中,如果没有__proto__属性,我如何检查null ？

Answer 1

我最近一直试图绕过这个,最后想出了这个"地图",我认为这个问题充分说明了这个问题.

http://i.stack.imgur.com/KFzI3.png

我知道我不是第一个提出这个问题的人,但更有意思的是找出它:-).无论如何,在那之后我发现了另外一个我认为基本相同的图表:

Javascript对象布局

对我来说最令人惊讶的事情是发现了这Object.__proto__一点Function.prototype,而不是Object.prototype,但我确信这是有充分理由的:-)

如果有人想测试它,我也粘贴图像中提到的代码.请注意,一些属性被添加到对象中,以便在一些跳转后很容易知道我们的位置:

Object.O1='';
Object.prototype.Op1='';

Function.F1 = '';
Function.prototype.Fp1 = '';

Cat = function(){};
Cat.C1 = '';
Cat.prototype.Cp1 = '';

mycat = new Cat();
o = {};

// EDITED: using console.dir now instead of console.log
console.dir(mycat);
console.dir(o);

Answer 2

constructor是prototype函数对象的属性所指向的对象的预定义[[DontEnum]]属性,并且最初将指向函数对象本身.

__proto__ 等价于对象的内部[[Prototype]]属性,即它的实际原型.

使用new运算符创建对象时,其内部[[Prototype]]属性将设置为构造函数的prototype属性指向的对象.

这意味着.constructor将评估.__proto__.constructor,即用于创建对象的构造函数,并且正如我们所知,protoype该函数的属性用于设置对象的[[Prototype]].

以下.constructor.prototype.constructor是相同的.constructor(只要这些属性没有被覆盖); 请看这里更详细的解释.

如果__proto__可用,您可以遍历对象的实际原型链.在简单的ECMAScript3中无法做到这一点,因为JavaScript不是为深度继承层次结构而设计的.

Answer 3

JavaScript中的Prototypal Inheritance基于__proto__属性,在某种意义上,每个对象都继承其__proto__属性引用的对象的内容.

该prototype属性仅对Function对象有用,并且仅在使用new运算符调用Function构造函数时才有效.在这种情况下,创建的对象__proto__将被设置为构造函数Function.prototype.

这意味着添加Function.prototype将自动反映__proto__所引用的所有对象Function.prototype.

Function.prototype用另一个对象替换构造函数不会更新__proto__任何已存在的对象的属性.

请注意,__proto__不应直接访问属性,而应使用Object.getPrototypeOf(object).

为了回答第一个问题,我创建了一个定制的图表__proto__和prototype参考,遗憾的是stackoverflow不允许我添加"低于10声望"的图像.也许还有一些时间.

[编辑]该图使用[[Prototype]]而不是__proto__因为这是ECMAScript规范引用内部对象的方式.我希望你能搞清楚一切.

这里有一些提示可以帮助您理解这个数字:

red    = JavaScript Function constructor and its prototype
violet = JavaScript Object constructor and its prototype
green  = user-created objects
         (first created using Object constructor or object literal {},
          second using user-defined constructor function)
blue   = user-defined function and its prototype
         (when you create a function, two objects are created in memory:
          the function and its prototype)

请注意,constructor属性在创建的对象中不存在,但是从原型继承.

Answer 4

Object是夏娃,Function是亚当,亚当(Function)用他的骨头(Function.prototype)来创造夏娃(Object).那么谁创造了Adam(Function)？ - JavaScript语言的发明者:-).

根据utsaina的回答,我想添加更多有用的信息.

对我来说最令人惊讶的事情是发现了这Object.__proto__ 一点Function.prototype,而不是Object.prototype,但我确信这是有充分理由的:-)

它不应该. Object.__proto__不应该指向Object.prototype.相反,实例Object o,o.__proto__应指向Object.prototype.

(请原谅我使用的条款class和instance在JavaScript,但你知道它:-)

我认为班级Object本身就是一个例子Function,这就是原因Object.__proto__ === Function.prototype.因此:Object是夏娃,Function是亚当,亚当(Function)用他的骨头(Function.prototype)来创造夏娃(Object).

此外,即使是班级Function本身也是其自身的一个实例Function,也就是说Function.__proto__ === Function.prototype,这也是原因Function === Function.constructor

此外,常规类Cat是实例Function,即Cat.__proto__ === Function.prototype.

上面的原因是,当我们在JavaScript中创建一个类时,实际上,我们只是创建一个函数,它应该是一个实例Function. Object并且Function只是特殊的,但它们仍然是课程,而且Cat是常规课程.

As a matter of factor, in Google Chrome JavaScript engine, the following 4:

• Function.prototype
• Function.__proto__
• Object.__proto__
• Cat.__proto__

它们===与其他3个(绝对相等),它们的价值是function Empty() {}

> Function.prototype
  function Empty() {}
> Function.__proto__
  function Empty() {}
> Object.__proto__
  function Empty() {}
> Cat.__proto__
  function Empty() {}
> Function.prototype === Function.__proto__
  true
> Function.__proto__ === Object.__proto__
  true
> Object.__proto__ === Cat.__proto__
  true

好.然后谁创建特殊function Empty() {}(Function.prototype)？想一想:-)

Answer 5

我真的不知道为什么人们没有纠正你的理解中的实际问题.

这将使您更容易发现问题

那么让我们看看发生了什么:

var newtoy = new Gadget("webcam", "black")

newtoy 
  .constructor //newtoy's constructor function is newtoy ( the function itself)
    .prototype // the function has a prototype property.( all functions has)
      .constructor // constructor here is a **property** (why ? becuase you just did `prototype.constructor`... see the dot ? )  ! it is not(!) the constructor function  !!! this is where your mess begins. it points back to the constructor function itself ( newtoy function)
         .prototype // so again we are at line 3 of this code snippet
            .constructor //same as line 4 ...
                .prototype 
                 rating = 3

好的,现在让我们看看这个 __proto__

在此之前,请记住以下两件事__proto__ :

1. 使用new运算符创建对象时,如果您愿意,其内部[[Prototype]]/ proto__属性将设置prototype为其constructor function"创建者" 的属性(1).

2. 在JS中硬编码 - :Object.prototype.__proto__是null.

让我们将这两点称为" bill"

newtoy
     .__proto__ // When `newtoy` was created , Js put __proto__'s value equal to the value of the cunstructor's prototype value. which is `Gadget.prototype`.
       .__proto__ // Ok so now our starting point is `Gadget.prototype`. so  regarding "bill" who is the constructor function now? watch out !! it's a simple object ! a regular object ! prototype is a regular object!! so who is the constructor function of that object ? Right , it's the `function Object(){...}`.  Ok .( continuing "bill" ) does it has a `prototype` property ? sure. all function has. it's `Object.prototype`. just remember that when Gadget.prototype was created , it's internal `__proto__` was refered to `Object.prototype` becuase as "bill" says :"..will be set to the `prototype` property of   its `constructor function`"
          .__proto__ // Ok so now our satrting point is `Object.prototype`. STOP. read bullet 2.Object.prototype.__proto__ is null by definition. when Object.prototype ( as an object) was created , they SET THE __PROTO__ AS NULL HARDCODED

更好？