JavaScript 的原型继承是如何工作的？

Question

我想知道 JavaScript 的原型继承是如何工作的。当我们使用 new 关键字创建对象时，对象的__proto__设置为Constructor_Function.prototype 。

但我不明白为什么我会得到这个输出。

我的代码：

function SimpleFunction(){}

let obj = new SimpleFunction();

console.dir(obj);

输出 ：

SimpleFunction {}
    [[Prototype]]: Object
        constructor: ƒ SimpleFunction()
        [[Prototype]]: Object
            constructor: ƒ Object()
            hasOwnProperty: ƒ hasOwnProperty()
            isPrototypeOf: ƒ isPrototypeOf()
            propertyIsEnumerable: ƒ propertyIsEnumerable()
            toLocaleString: ƒ toLocaleString()
            toString: ƒ toString()
            valueOf: ƒ valueOf()
            __defineGetter__: ƒ __defineGetter__()
            __defineSetter__: ƒ __defineSetter__()
            __lookupGetter__: ƒ __lookupGetter__()
            __lookupSetter__: ƒ __lookupSetter__()
            __proto__: Object
                constructor: ƒ SimpleFunction()
                [[Prototype]]: Object
                constructor: ƒ Object()
                hasOwnProperty: ƒ hasOwnProperty()
                isPrototypeOf: ƒ isPrototypeOf()
                propertyIsEnumerable: ƒ propertyIsEnumerable()
                toLocaleString: ƒ toLocaleString()
                toString: ƒ toString()
                valueOf: ƒ valueOf()
                __defineGetter__: ƒ __defineGetter__()
                __defineSetter__: ƒ __defineSetter__()
                __lookupGetter__: ƒ __lookupGetter__()
                __lookupSetter__: ƒ __lookupSetter__()
                __proto__: Object
                    constructor: ƒ Object()
                    hasOwnProperty: ƒ hasOwnProperty()
                    isPrototypeOf: ƒ isPrototypeOf()
                    propertyIsEnumerable: ƒ propertyIsEnumerable()
                    toLocaleString: ƒ toLocaleString()
                    toString: ƒ toString()
                    valueOf: ƒ valueOf()
                    __defineGetter__: ƒ __defineGetter__()
                    __defineSetter__: ƒ __defineSetter__()
                    __lookupGetter__: ƒ __lookupGetter__()
                    __lookupSetter__: ƒ __lookupSetter__()
                    __proto__: null
                    get __proto__: ƒ __proto__()
                    set __proto__: ƒ __proto__()
                get __proto__: ƒ __proto__()
                set __proto__: ƒ __proto__()
            get __proto__: ƒ __proto__()
            set __proto__: ƒ __proto__()

当我尝试这个时：

obj.__proto__.__proto__.__proto__;

我有 ：

null

所以我不明白为什么输出中有超过三个原型对象。

Answer 1

所以我不明白为什么输出中有超过三个原型对象。

这是因为SimpleFunction()构造函数是派生源对象（ 函数也是具有原型的对象）。 由于SimpleFunction()是用户定义的，因此它必须像所有其他对象一样从 Object 对象继承。 因此，您拥有函数对象及其原型 Object 对象，然后您拥有从构造函数派生的obj及其自己的 Object 对象原型。

参考

如果有兴趣，这里是描述此过程的规范

不，[[Prototype]] 和__proto__不是一回事。 如果您查看日志，您将看到名为__proto__ setter 和 getter。 所以__proto__实际上是存取器属性[[原型]]，而[[原型]]反映了实际的对象，它是原型。

参考