聊聊JS高级的原型和原型链

对于原型和原型链的理解

对象的__proto__指向原型，__proto__将对象和原型连接起来组成原型链 js中的一个对象可能会有父对象、父对象可能又有父对象，连接他们之间的关系就是原型链。

原型链的根本是继承，每个对象都有__proto__属性，指向构造函数的原型。可以用__proto__访问到父对象中的属性和方法。

根对象是  Object.prototype

原型链上各个模块的关系

构造函数通过prototype指向原型，原型的constructor指回构造函数，构造函数通过new创建实例对象，实例对象的***_proto_***指向原型。

总结：

• Object.prototype是所有对象的爸爸，所有对象都可以通过__proto__找到它。对于JS来说，万物继承自Object说法不严谨
• Function.prototype是所有函数的爸爸，所有函数都可以通过__proto__找到它
• prototype是一个对象
• 对象的__proto__指向原型，__proto__将对象和原型连接起来组成原型链

举几个例子

简单例子

我们创建一个数组，可以发现能使用我们没有定义过的函数，这就是obj通过原型链查找，obj.__proto_有splice吗？假设没有，就会找obj._proto_._proto,一直找下去，直到null

let obj = [1,4,5,0]
obj.splice(0,1)
console.log(obj)//[4,5,0]

上次也讲了js五种继承方式的组合继承，通过原型来看看

function Parent(name) {
        this.name = name
    }
    Parent.prototype = {
        constructor: Parent,
        say: function() {
            console.log(this.name + '在说话');
        },
        sing: function() {
            console.log(this.name + '在唱歌')
        }
    }
    function Child(name, age) {
        //继承父类的属性
        Parent.call(this, name)
    }
       //改变child的原型,来继承父类的函数
    Child.prototype = new Parent()
    
    let child = new Child('jack')
    child.say()//jack在说话

直接手画图了，很容易看懂

• 首先，改变child的原型之前
• 改变child原型之后，child原型改为了Parent构造函数new出来的实例对象，如下图。child._proto_.__proto__可以访问到Parent原型中的属性
• 有个箭头手误了，大家能发现吧哈哈（应该是Parent构造函数指向parent对象） -打印一下child._proto_._proto_:

以上是我总结对于原型和原型链的理解。