我的理解是:__proto__和prototype都是为原型链技术服务的。区别在于以下划线命名的函数(如__proto__)根本不是开发人员显式调用的目标。换句话说，它们只是用于继承等机制，它们是“后端”。但是不带下划线的函数是为显式调用而设计的，它们是“前端”。

我认为你需要知道__proto__， [[prototype]]和prototype之间的区别。

公认的答案是有帮助的，但它可能暗示(不完全)__proto__只与在构造函数上使用new创建的对象相关，这是不正确的。

更准确地说:__proto__存在于每个对象上。

But what is __proto__ at all? Well, it is an object referencing another object which is also a property of all objects, called [[prototype]]. It's worth mentioning that [[prototype]] is something that JavaScript handles internally and is inaccessible to the developer. Why would we need a reference object to the property [[prototype]] (of all objects)? Because JavaScript doesn't want to allow getting / setting the [[prototype]] directly, so it allows it through a middle layer which is __proto__. So you can think of __proto__ as a getter/setter of the [[prototype]] property. What is prototype then? It is something specific to functions(Initially defined in Function, i.e, Function.prototype and then prototypically inherited by newly created functions, and then again those functions give it to their children, forming a chain of prototypical inheritance). JavaScript uses a parent function's prototype to set its child functions' [[prototype]] when that parent function is run with new (remember we said all objects have [[prototype]]? well, functions are objects too, so they have [[prototype]] as well). So when the [[prototype]] of a function(child) is set to the prototype of another function(parent), you will have this in the end: let child = new Parent(); child.__proto__ === Parent.prototype // --> true. (Remember child.[[prototype]] is inaccessible, so we checked it using __proto__.)

注意1:只要属性不在子对象中，它的__proto__将被“隐式”搜索。例如，if child。Myprop返回一个值，你不能说" Myprop "是子对象的属性，还是父对象原型的属性。这也意味着你永远不需要做这样的事情:child.__proto__.__proto__。我的东西你自己拿去吧，孩子。Myprop会自动为你做这件事。

注意2:即使父对象的原型中有项目，子对象自己的原型最初也是一个空对象。如果您想进一步扩展继承链(将child[ren]添加到child)，则可以向其中添加项或手动从其中删除项。或者可以隐式地操纵它，例如使用类语法。)

注意3:如果你需要自己设置/获取[[prototype]]，使用__proto__有点过时，现代JavaScript建议使用Object。setPrototypeOf和Object。getPrototypeOf代替。

在JavaScript中，函数可以用作构造函数。这意味着我们可以使用new关键字从它们中创建对象。每个构造函数都带有一个内置对象。这个内置对象称为原型。构造函数的实例使用__proto__来访问其构造函数的prototype属性。

First we created a constructor: function Foo(){}. To be clear, Foo is just another function. But we can create an object from it with the new keyword. That's why we call it the constructor function Every function has a unique property which is called the prototype property. So, Constructor function Foo has a prototype property which points to its prototype, which is Foo.prototype (see image). Constructor functions are themselves a function which is an instance of a system constructor called the [[Function]] constructor. So we can say that function Foo is constructed by a [[Function]] constructor. So, __proto__ of our Foo function will point to the prototype of its constructor, which is Function.prototype. Function.prototype is itself is nothing but an object which is constructed from another system constructor called [[Object]]. So, [[Object]] is the constructor of Function.prototype. So, we can say Function.prototype is an instance of [[Object]]. So __proto__ of Function.prototype points to Object.prototype. Object.prototype is the last man standing in the prototype chain. I mean it has not been constructed. It's already there in the system. So its __proto__ points to null. Now we come to instances of Foo. When we create an instance using new Foo(), it creates a new object which is an instance of Foo. That means Foo is the constructor of these instances. Here we created two instances (x and y). __proto__ of x and y thus points to Foo.prototype.

另一种理解它的好方法是:

var foo = {}

/* 
foo.constructor is Object, so foo.constructor.prototype is actually 
Object.prototype; Object.prototype in return is what foo.__proto__ links to. 
*/
console.log(foo.constructor.prototype === foo.__proto__);
// this proves what the above comment proclaims: Both statements evaluate to true.
console.log(foo.__proto__ === Object.prototype);
console.log(foo.constructor.prototype === Object.prototype);

仅当支持IE11 __proto__后。在那个版本之前，比如IE9，你可以使用构造函数来获取__proto__. dll。

这个问题有很多很好的答案，但为了概括和紧凑形式的答案，我添加了以下内容:

我们必须考虑的第一件事是，当JS发明的时候，计算机的内存非常低，所以如果我们需要一个进程来创建新的对象类型，我们必须考虑内存性能。

因此，他们在内存的独立部分，定位由特定对象类型创建的对象需要的方法，而不是每次我们创建一个新对象时，在对象之外存储方法。 因此，如果我们用JS的新特性重新定义新的运算符和构造函数概念，我们有以下步骤:

和空对象。(这将是对象类型实例化的最终结果)

let empty={}

我们已经知道，由于内存性能原因，对象类型实例所需的所有方法都位于构造函数的prototype属性上。(函数也是对象，所以它们可以有属性) 因此，我们将空对象的__protp__引用到这些方法存在的位置。 (我们将概念上作为构造函数使用的函数命名为构造函数。

empty.__proto__ = constructor.prototype

我们必须初始化对象类型值。 在JS中的函数与对象断开连接。使用点表示法或函数对象的bind call apply等方法，我们必须知道“函数的上下文是什么”。

let newFunc = constructor.bind(empty)

现在我们有了一个新函数，它有一个空对象作为这个context。 执行此函数后。空对象将被填充，如果定义的构造函数函数没有返回，类型object的实例化结果将是这个空对象(就好像这将是该过程的结果一样)

所以正如你所看到的，__proto__是一个对象的属性，它引用了其他对象(在JS中函数也是对象)原型对象属性，它由跨特定对象类型的实例使用的属性组成。

正如你可以从短语中猜到的那样，函数是对象，函数也有__proto__属性，因此它们可以引用其他对象的prototype属性。这就是原型继承的实现方式。

让我用一个简单的例子来解释:

function User(email, name){
    this.email = email;
    this.name = name;
    this.online = false;
    // method directly added to the constructor
    this.greet = ()=>{
        console.log(`Hi ${this.name}`);
    }
}
// Adding prototype method login to the constructor function. 
User.prototype.login = function(){
    this.online = true;
    console.log(this.email, 'has logged in');
};
// Adding prototype method logout to the constructor function.
User.prototype.logout = function(){
    this.online = false;
    console.log(this.email, 'has logged out');
};
 
var userOne = new User('ryu@ninjas.com', 'Ryu');
var userTwo = new User('yoshi@mariokorp.com', 'Yoshi');
 
console.log(userOne);
userTwo.login();
userTwo.greet();

输出:

结论:

在构造函数中添加的属性和方法是 直接添加到对象中。 添加的属性和方法 .prototype。被添加到对象的__proto__属性中。我们甚至可以看到userOne。__proto__或userTwo.__proto__