javascript中__proto__和prototype的区别

Question

__proto__和prototype的区别，刚看到一句解释是这样的：

__proto__是站在对象的角度讨论原型对象。
prototype是站在构造函数的角度讨论原型属性，或构造函数创建的对象的原型对象。

仍然不是很理解，请大神帮展开来再说一下。所谓展开大概就是像知乎那样啰嗦的讲一下“我是谁，我从哪里来，我要到哪里去”3个问题。
或者换个说法，就是讲一个东西的时候，一般从3个维度来讲，
1、这个东西是什么？
2、这个东西有什么用？
3、这个东西怎么用？
如果不讲清楚这3个问题，就理解不了，因为我比较傻。谢谢。

另外有个具体的问题是：
最后一句“构造函数创建的对象的原型对象”，意思是当new一个对象的时候，这个new出来的对象是由构造函数创建的？

Answer 1

给你看三张图片：

javascript是基于对象的，换一种说法是基于原型(链)的。

每一个函数都有一个prototype(原型)属性,这个属性是一个对象，它的用途是包含可以由特定类型的所有实例共享的属性和方法。prototype是通过调用构造函数来创建的那个对象的原型(属性)对象。

Javascript中对象的prototype属性，可以返回对象的 原型对象 的引用。

怎么理解原型(链)？
图1
函数(对象)有prototype属性->对应了一个原型对象->每个原型对象都有一个constructor属性->包含一个指向prototype属性所在函数的指针

每一个实例都有一个内部属性__proto__->指向原型对象

这里提到的几个属性或对象：
Person.prototype;//->原型对象
Person.prototype.constructor;//->指向构造函数

p.__proto__;//->指向原型对象

Answer 2

其实没有那么复杂，你只是被一些概念性的东西弄迷糊了。
所谓的构造函数就只是一个普普通通的函数，只是它实现的功能就是为了new 一个object

例如:

function Person(name,age){  //一般构造函数的首字母大写，这是规范
    this.name=name;
    this.age=age;
}
Person.prototype={    //给Person的原型上添加方法
    a:function(){
        alert(this.name);   
    }
}
var obj=new Person('张三','20');   //obj就是构造函数Person的实例对象
console.log(obj.name)  //张三
console.log('obj.age') // 20
obj.a();  //alert 出张三     

Answer 3

_proto_在es5里指向构造函数的prototype，在es6里指向该构造函数。看它的__就知道他是个私有属性了，不建议使用。
比如`复制代码
function A(){

console.log(this.__proto__.aa);//1 
this.aa=2

}
A.prototype={

aa:1

}
var a=new A;
console.log(a.aa);//2
a.__proto__={

aa:3

}
delete a.aa;//删除特权属性
console.log(a.aa);//3`
在不操作a.__proto__的时候，a.aa会是2。
prototype就是原型了。主要用于继承，比如你在Function.prototype定义一个函数，所有函数都有这个方法。
这有一篇js继承相关的文章：闲聊js继承

Answer 4

String.prototype.test = function(){
   console.log("test from String");
};
var testStr = new String();
testStr.test();// test from String
testStr.__proto__ === String.prototype; //true

函数对象都会有个prototype属性，这个其实就是函数对象的一个实例。而每一个对象（如testStr）的__proto__属性均指向这个prototype。就像上面的例子，给String扩展了一个test方法。