JavaScript的原型和原型链（二）

旧城等待， 2022-04-10 07:29 270阅读 0赞

# constructor构造函数 #

我们昨天说创建对象的三种方式，第二种是通过new创建对象

let  obj = new Object()//创建一个空对象等同于 var obj = {}
    console.log(obj.constructor === Object)//true

Object就是一个构造函数，是js内置的构造函数,上面的例子中Object就是obj的构造函数，这个例子似乎不太明显，我们继续看

function Person(name){ 
        this.name = name
    }
    let LJJ = new Person("刘家军")
    console.log(LJJ.constructor === Person)//true

我们自定义了一个构造函数Person，**Person是LJJ的构造函数,LJJ的构造函数就是Person**  
构造函数与其他函数的唯一区别，就在于调用它们的方式不同。不过，构造函数毕竟也是函数，不存在定义构造函数的特殊语法。任何函数，只要通过 new 操作符来调用，那它就可以作为构造函数；而任何函数，如果不通过 new 操作符来调用，那它跟普通函数也不会有什么两样。  
构造函数在创建时有一个约定，如果是构造函数，那么首字母要大写，普通函数首字母小写

# constructor和prototype #

constructor和我们昨天讨论的prototype有什么联系吗？  
观察如下代码的输出

function Person(name) { 
        this.name = name;
    }
    let LJJ = new Person("刘家军");
    
    console.log(Person.prototype)

输出：  
![在这里插入图片描述][20181228163706754.png]  
Person.prototype是Person的原型对象  
继续贴代码

function Person(name) { 
        this.name = name;
    }
    let LJJ = new Person("刘家军");
     console.log(Person.prototype.constructor === Person) // true

在默认情况下，所有原型对象都会自动获得一个 constructor（构造函数）属性，这个属性包含一个指向 prototype 属性所在函数的指针。就拿前面的例子来说，Person.prototype.constructor 指向 Person。  
我们得出以下结论  
原型对象中的constructor属性，指向该原型对象对应的构造函数  
也就是说上面的例子，Person的原型对象是Person.prototype,原型对象（Person.prototype）中有一个constructor属性，这个constructor属性指向原型对象（Person.prototype）对应的构造函数Person，用一行代码概括

console.log(Person.prototype.constructor === Person) // true

以上就是constructor和prototype的关系  
我们注意到原型对象（Person.prototype）中还存在一个属性\_\_proto\_\_,这又是什么？它和prototype，constructor又有什么关联呢？

# 隐式原型(\_\_\_ proto\_\_\_) #

那么\_\_proto\_\_是什么？每个对象都会在其内部初始化一个属性，就是\_\_proto\_\_。  
Firefox、Safari 和 Chrome 的每个对象上都有这个属性 ，而在其他浏览器中是完全不可见的（为了确保浏览器兼容性问题，不要直接使用 **proto** 属性，此处只为演示）。我们继续看代码

let obj = new Object()
    console.log(obj.__proto__ === Object.prototype) // true
    let Fun = new Function()
    console.log(Fun.__proto__ === Function.prototype) // true
    let arr = new Array()
    console.log(arr.__proto__ === Array.prototype) // true
    let str = new String()
    console.log(str.__proto__ === String.prototype) // true
    let bool = new Boolean
    console.log(bool.__proto__ === Boolean.prototype) // true
    function MyFun() { 
        console.log("我是刘家军");
    }
    var LJJ = new MyFun()
    console.log(LJJ.__proto__ === MyFun.prototype) // true

再重复一次：Array，String，Function，Boolean，Object都是js内置的构造函数，MyFun是自定义的构造函数

> 只有函数对象才存在prototype  
> 所有对象(除了Object.prototype)都存在\_\_proto\_\_

刚才我们讨论过，普通对象都是通过函数创建的 根据以上我们得出结论： \*\*普通对象\_\_proto\_\_指向当前函数对象的原型，\*\* 你可能发现了，有一个矛盾的地方，所有对象都存在\_\_proto\_\_，只有普通对象的\_\_proto\_\_指向当前函数对象的原型，那函数对象的\_\_proto\_\_指向哪里呢？继续看代码

function MyFun() { 
        console.log("我是刘家军")
    }
    console.log(Boolean.__proto__) // ƒ () { [native code] }
    console.log(Function.__proto__) // ƒ () { [native code] }
    console.log(String.__proto__) // ƒ () { [native code] }
    console.log(Array.__proto__) // ƒ () { [native code] }
    console.log(Object.__proto__) // ƒ () { [native code] }
    console.log(MyFun.__proto__) // ƒ () { [native code] }

函数对象的\_\_proto\_\_输出的都是ƒ () \{ \[native code\] \}  
函数内部是\[native code\]，也就是系统编译好的二进制代码函数，我们不对此做研究  
上面说到，所有对象都有\_\_proto\_\_，原型对象也是对象，  
我们得出结论  
**原型对象也存在\_\_proto\_\_**  
结合以上我门又一次得出结论  
**原型对象的\_\_proto\_\_指向当前函数对象的原型，**  
还是继续看代码，便于理解\*

console.log('刘家军'.__proto__ === String.prototype) // true
    console.log(String.prototype.__proto__ === Object.prototype) // true
    //等量代换，得出一下结论
    console.log('刘家军'.__proto__.__proto__ === Object.prototype) // true
    //自此形成了一条链，===>原型链

解释一下如上代码，  
"刘家军"是字符串类型，"刘家军"的构造函数是String(), 所以"刘家军"的\_\_proto\_\_指向String的原型  
String()是js的内置构造函数，继承自Object，也就是说Object是顶端，是原型链的顶端，既然是顶端，所以：

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

Object的原型对象是不存在\_\_proto\_\_的

# 总结 #

所有对象（不包括Object.prototype）有\_\_proto\_\_属性，函数对象有prototype属性；  
对象由函数生成;  
生成对象时，对象的\_\_proto\_\_属性指向当前函数的prototype属性。  
Object.prototyp处于原型链的顶端，不存在原型，不继承任何属性，其他原型对象都是普通对象，普通对象都具有原型，所有的内置构造函数（以及大部分自定义构造函数）都具有一个继承自Object.prototype的原型，例如Date.prototype的 属性继承自Object.prototype，因此有new Date()创建的Date对象的属性同时继承自Date.prototype和Object.prototype,这一系列的原型对象就是所谓的原型链。

友情链接：[点击查看所有文章目录][Link 1]

友情链接：[点击查看　JavaScript原型与原型链系列文章目录][JavaScript]

[20181228163706754.png]: /images/20220402/5aa7516278e245d091a792d65e508ecd.png
[Link 1]: https://blog.csdn.net/qq_42911663/article/details/86365901
[JavaScript]: https://blog.csdn.net/qq_42911663/article/details/86368799