原型、原型链、构造函数、实例的关系

本文链接：https://blog.csdn.net/technology_hands/article/details/131981399

本文介绍了JavaScript中的构造函数、原型及原型链的概念。每个构造函数都有一个原型，实例对象通过原型链可以访问构造函数的属性和方法。原型链由__proto__属性连接，最终指向null。原型链的设计旨在实现方法和属性的继承，使得下层对象能共享上层对象的方法。

摘要由CSDN通过智能技术生成

跟我的思路一步一步来拓展理解。

我们设置了一个构造函数命名为Fun。

        function Fun() {
        }

总所周知，每一个构造函数都是拥有一个原型的，也就是Fun.prototype,并且原型的创造者（.constructor）是Fun(构造函数)。

我们可以证实一下

        function Fun() {
        }

        console.log('66',Fun.prototype.constructor==Fun) //true

结论：1.我们的第一个结论就是每一个构造函数都有一个原型，并且这个原型是由构造函数创造的。

接下来我们使用构造函数去创建一个实例对象

        function Fun() {
        }

        var fun = new Fun();  // 新建实例对象

毋庸置疑，fun(实例对象)也是Fun(构造函数)创造的，但是原型和实例之间出现了一个链条，这个链条可以让实例去使用Fun的原型的方法和属性。

我们还是可以测试一下

        let Fun = function(){

        }

        let fun = new Fun()

        console.log('Fun.prototype==fun._proto_',Fun.prototype==fun.__proto__)//true

结论：2. 构造函数（Fun）的原型(Fun.prototype) 就是实例(fun)的__protp__属性，但是这里大家要知道，其实原型是构造函数的属性，实例只是一种关联关系，不代表示例也有原型。

接下来我们继续拓展，由下图可知，其实每一个构造函数的原型还有一个原型（Object.prototype），这个原型是由Object函数创造的，而Object.prototype还有一个原型，那就是null，右边这一条由__protp__连接起来的链条就是就是原型链。

接下来我们就来验证一下

        let Fun = function(){

        }

        let fun = new Fun()

        console.log('Object.prototype.constructor===Object',Object.prototype.constructor===Object) //true
        console.log('Object.prototype==Fun.prototype',Object.prototype===Fun.prototype.__proto__) //true
        console.log('Object.prototype==Fun.prototype',Object.prototype.__proto__===null) //true

好的这下我们就搞清楚原型链了，那么原型链究竟是为了什么设计出来呢，是为了方法和属性的继承，在原型链下方的对象，都会继承原型链上方的方法。这样就可以拥有共同的方法了