关于JS中原型链中的prototype与_proto_的我的理解与详细总结

转载自：https://www.cnblogs.com/az96/p/6014621.html

一直认为原型链太过复杂，尤为看过某图后被绕晕了一整子，今天清理硬盘空间（渣电脑），偶然又看到这图，勾起了点回忆，因而索性复习一下原型链相关的内容，表达能力欠缺逻辑混乱别见怪（为了防止新人__（此处指我）__被在此绕晕，图片就放在末尾了。）

如下三点须要谨记

 

1.每一个对象都具备一个名为__proto__的属性；

2.每一个构造函数（构造函数标准为大写开头，如Function()，Object()等等JS中自带的构造函数，以及本身建立的）都具备一个名为prototype的方法（注意：既然是方法，那么就是一个对象（JS中函数一样是对象），因此prototype一样带有__proto__属性）；

3.每一个对象的__proto__属性指向自身构造函数的prototype；

 

直接上代码.....

function Fun(){
            }
//            我创造了一个函数Fn
//            这个函数由Function生成（Function做为构造函数）
            var fn=new Fun()
//            我建立了一个函数fn
//            这个函数由Fn生成（Fn做为构造函数)
            
            
            console.log(fn.__proto__===Fun.prototype)    //true
//            fn的__proto__指向其构造函数Fun的prototype
            console.log(Fun.__proto__===Function.prototype)        //true
//            Fun的__proto__指向其构造函数Function的prototype
            console.log(Function.__proto__===Function.prototype)    //true
//            Function的__proto__指向其构造函数Function的prototype
//            构造函数自身是一个函数，他是被自身构造的
            console.log(Function.prototype.__proto__===Object.prototype)    //true
//            Function.prototype的__proto__指向其构造函数Object的prototype
//            Function.prototype是一个对象,一样是一个方法,方法是函数,因此它必须有本身的构造函数也就是Object
            console.log(Fun.prototype.__proto__===Object.prototype)         //true
//             与上条相同
//             此处能够知道一点,全部构造函数的的prototype方法的__都指向__Object.prototype(除了....Object.prototype自身)
            console.log(Object.__proto__===Function.prototype)        //true
//            Object做为一个构造函数(是一个函数对象!!函数对象!!),因此他的__proto__指向Function.prototype
            console.log(Object.prototype.__proto__===null)        //true
//            Object.prototype做为一切的源头,他的__proto__是null

//            下面是一个新的,额外的例子

            var obj={}
//            建立了一个obj
            console.log(obj.__proto__===Object.prototype)        //true
//            obj做为一个直接以字面量建立的对象，因此obj__proto__直接指向了Object.prototype，而不须要通过Function了！！

//            下面是根据原型链延伸的内容
//            还有一个上文并未提到的constructor,  constructor在原型链中,是做为对象prototypr的一个属性存在的,它指向构造函数（因为主要讲原型链，这个就没在乎、）；

            console.log(obj.__proto__.__proto__===null)        //true
            console.log(obj.__proto__.constructor===Object)        //true
            console.log(obj.__proto__.constructor.__proto__===Function.prototype)        //true
            console.log(obj.__proto__.constructor.__proto__.__proto__===Object.prototype)    //true    
            console.log(obj.__proto__.constructor.__proto__.__proto__.__proto__===null)        //true
            console.log(obj.__proto__.constructor.__proto__.__proto__.constructor.__proto__===Function.prototype)    //true
            
            
//            以上，有兴趣的能够一一验证　　F12搞起.

 

prototype是构造函数独有的属性；

对象的__prototype__属性一般与其构造函数的prototype属性相互对应；

全部构造函数的的prototype方法的__都指向__Object.prototype(除了....Object.prototype自身)；

 

须要注意的指向是

Function的__proto__指向其构造函数Function的prototype；

Object做为一个构造函数(是一个函数对象!!函数对象!!),因此他的__proto__指向Function.prototype；

Function.prototype的__proto__指向其构造函数Object的prototype；

Object.prototype的__prototype__指向null（尽头）；

 

原型链经常使用于继承相关的操做.

 

在文章结构顺便附送上俩个与原型链相关的方法....欢迎食用

1.

hasOwnProperty判断一个对象是否有名称的属性或对象，此方法没法检查该对象的原型链中是否具备该属性，该属性必须是对象自己的一个成员。 

若是该属性或者方法是该 对象自身定义的而不是器原型链中定义的 则返回true;不然返回false; 

格式以下： 

 

object.hasOwnProperty(proName); 　　
括号内必需要加引号，而且直接写入属性名

 

2.

 

isPrototypeOf是用来判断指定对象object1是否存在于另外一个对象object2的原型链中，是则返回true，不然返回false。 

格式以下： 

object1.isPrototypeOf(object2); 

object1是一个对象的实例； 

object2是另外一个将要检查其原型链的对象。 

原型链能够用来在同一个对象类型的不一样实例之间共享功能。 

若是 object2 的原型链中包含object1，那么 isPrototypeOf 方法返回 true。 

若是 object2 不是一个对象或者 object1 没有出如今 object2 中的原型链中，isPrototypeOf 方法将返回 false。

附图：

 

理解了上面两条链之后，这两个全图实际上就不难理解了。分享一下，怎么来读懂这个图：

• 首先看构造函数链。全部的普通对象，constructor 都会指向它们的构造函数；而构造函数也是对象，它们最终会一级一级上溯到 Function 这个构造函数。Function 的构造函数是它本身，也即此链的终结；
• Function 的 prototype 是 Function.prototype，它是个普通的原型对象；
• 其次看原型链。全部的普通对象，__proto__ 都会指向其构造函数的原型对象 [Class].prototype；而全部原型对象，包括构造函数链的终点 Function.prototype，都会最终上溯到 Object.prototype，终结于 null。

也便是说，构造函数链的终点 Function，其原型又融入到了原型链中：Function.prototype -> Object.prototype -> null，最终抵达原型链的终点 null。至此这两条契合到了一块儿。