js __proto__和prototype的关系

前言

           小伙伴们，在js的学习道路上你们，必定会碰到实例上的__proto__和构造函数上的prototype,这两个属性，你们对这两个属性的关系，理解完全吗？我反正以前是不太清楚。今天我看了一些高程三上的知识，分享给你们。

js中函数的身份

• 普通的函数
• js对象
• 构造函数

           其实js中的函数，很像我们人类，在不一样的环境，扮演者不一样的身份。好比我

• 在公司是一名员工
• 在社会上是一名公民
• 在父母眼中是一个孩子

           小伙伴看一下，这种角色扮演，没有毛病吧，我们这么一结合和，发现js 是否是颇有趣。

     当函数扮演普通函数的时候，他就是一个函数，用来完成每一个功能或者过个功能的方法。      当函数扮演普通js对象的时候，他就是一个对象，有本身私有属性、方法和继承父级的的属性、方法

     当函数扮演构造函数的时候，他就是一个构造函数，使用new就能够建立出实例。

           不管何时，只要建立了一个新函数，就会根据一组特定的规则为该函数建立一个 prototype 属性，这个属性指向函数的原型对象，在默认状况下，全部原型对象都会自动得到一个 constructor （构造函数）属性， 这个属性是一个指向 prototype 属性所在函数的指针。 就拿前面的例子来讲， Person.prototype.constructor 指向 Person。而经过这个构造函数，咱们还可继续为原型对象添 加其余属性和方法。咱们能够的到一个恒等的公式 Person.prototype.constructor===Person

也能够在prototype的属性上添加一些实例共享的方法、属性

function Person(){ }

Person.prototype.name = "Nicholas"; 
Person.prototype.age = 29; 
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){ alert(this.name); };
var person1 = new Person(); 
person1.sayName(); //"Nicholas"
复制代码

           每一个实例都会有个__proto__属性，这个属性是一个引用地址，指向该构造函数的prototype的指针上。

       那么我们就会获得一个恒等的公式

原型链

           看代码

function Person(){ }

Person.prototype.name = "Nicholas"; 
Person.prototype.age = 29; 
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){ alert(this.name); };
var person1 = new Person();
person1.sayName(); //"Nicholas"
person1.age; // 29
复制代码

上面的例子我们看到了实例person1的age是29 ，那么age是怎么找到的呢，首先会去person1的私有属性（自己的属性），有没有age，若是有的话就去这个属性的值，若是没有就会查找person1.__proto__指向上的对象（Person.prototype）有没有该属性有的话就会返回该属性的值，若是没有接着查找person1.proto.__proto__直到Object.prototype指向的对象有没有，没有的就返回undefined。上述的查找过程就是做用域链。

           构造函数的原型属性是不能够经过实例的进行来修改的，看代码

function Person(){ }

Person.prototype.name = "Nicholas"; 
Person.prototype.age = 29; 
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){ alert(this.name); };
var person1 = new Person();
var person2 = new Person();
person1.age = 39;
console.log(person1.age)//39
console.log(person2.age)// 29
复制代码

           直接给实例属性添加value的话和添加到实例的私有属性上。怎么判断数属性是私有仍是构造函数的原型上面的呢，看代码

function Person(){ }

Person.prototype.name = "Nicholas"; 
Person.prototype.age = 29; 
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){ alert(this.name); };
var person1 = new Person();
var person2 = new Person();
person1.age = 39;
person1.hasOwnProperty('age')//true
person2.hasOwnProperty('age')//false

复制代码

           怎么判断实例是否属于该构造函数使用 Object.getPrototypeOf(new Person),返回的是Person.prototype

function Person(){ }

Person.prototype.name = "Nicholas"; 
Person.prototype.age = 29; 
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){ alert(this.name); };
var person1 = new Person();
var person2 = new Person();
Object.getPrototypeOf(person1)===Person.prototype//true
Object.getPrototypeOf(person2)===Person.prototype// true

复制代码