js 原型、原型链、构造器关系

川长思鸟来 2022-06-11 06:39 165阅读 0赞

# js 原型、原型链、构造器关系 #

写在前面

*  已实例化的对象只有\_\_proto\_\_属性
 *  未实例化的对象有prototype和\_\_proto\_\_属性
 *  构造器是prototype对象的一个属性

上图  
![这里写图片描述][SouthEast]  
测试走起

***1.普通函数***

function A(x){ 
        this.x=x;
    }
    console.log(A.prototype.constructor)//function A()
    console.log(A.prototype.__proto__===Object.prototype)//true
    console.log(A.__proto__===Function.prototype)//true

*  函数原型(prototype)的构造器(constructor)指向构造函数自身
 *  函数原型的原型链(\_\_proto\_\_)指向Object的原型(prototype)
 *  函数对象的原型链指向Function(所有函数对象的爸爸)的原型

function A(x){
        this.x=x;
    }
    var A1=new A(1);
    console.log(A1.__proto__===A.prototype)//true
    console.log(A1.__proto__.constructor)//function A()
    console.log(A1.constructor)//function A()

*  函数实例的原型链(\_\_proto\_\_)指向其构造函数的原型(prototype)
 *  函数实例的构造器就是其构造函数
    
    ***2.对象函数***

console.log(Object.prototype.constructor)//function Object()
    console.log(Object.__proto__===Function.prototype)//true

*  对象函数原型(prototype)的构造器(constructor)指向对象构造函数自身
 *  当然Function也是Object他爸

var obj=new Object();
    obj={
        a:'a',
        b:'b'
    }
    console.log(obj.__proto__===Object.prototype)//true
    console.log(obj.__proto__.constructor)//function Object()
    console.log(obj.constructor)//function Object()

*  对象的原型链(\_\_proto\_\_)指向对象函数的原型(prototype)
 *  对象的构造器(constructor)是对象函数
    
    ***3.Function函数***

console.log(Function.prototype.constructor)//function Function() 
    console.log(Function.__proto__===Function.prototype)//true
    console.log(Function.prototype.__proto__===Object.prototype)//true

*  Function的构造器(constructor)指向Function
 *  Function的原型链(\_\_proto\_\_)指向Function的原型(prototype)
 *  Function原型的原型链(\_\_proto\_\_)指向Object的原型(prototype)
    
    ***4.归于虚无***

console.log(Object.prototype.__proto__===null)//true

*  Object原型(prototype)的原型链(\_\_proto\_\_)指向null

[SouthEast]: /images/20220611/cb0ba5bb07b14878b14f99b22dc7e209.png