JavaScript 什么是原型链?

原型链 : 实例对象与原型之间的链接,叫做原型链

下面我们演示个小例子来说明原型链

function Aaa()

        }
        Aaa.prototype.num = 10;
        var a1 = new Aaa();
        alert(a1.num); // 10      

大家可能会想，为什么这个对象a1可以找到num

1、首先大家发现这个num并不是挂载到a1的对象下面，而是挂载到构造函数的原型下面

2、那么a1怎么能够找到原型下面的num呢

我们知道a1下面是没有num的，于是就随着原型链查找，找到了num=10

这时我们在构造函数里面写上this.num = 20;

这时a1.num弹出的是10还是20；那么为什么是20呢？

之前我们打过一个比方，你可以把普通的方法或普通的属性看作是CSS中的style，

把原型下的属性或方法看作是CSS中的class，我们都知道style的优先级要比class的优先级要高

<script>function Aaa()
            this.num = 20;
        }
        Aaa.prototype.num = 10;
        var a1 = new Aaa();
        alert(a1.num); // 20</script>      

但是现在我们用原型链的方式来解释为什么是弹出来20

我们知道现在构造函数里面的this就是a1,

原型链的查找是从内层一层层的往外查找

所以先会在①处查找，①找到了所以就直接弹出来，①处找不到才会顺在原型链往上查找

这就是为什么普通的要高于原型的

这时我们考虑原型链究竟有多长?

原型链的最外层其实是 : Object.prototype

我们做个实验

我们把①②处的代码都注释起来，在写上Object.prototype.num = 30;最终弹出来的是30

<script>// 原型链 : 实例对象与原型之间的链接,叫做原型链
        // 原型链的最外层其实是:Object.prototype
        function Aaa()
           // this.num = 20;
        }
        // Aaa.prototype.num = 10;
        Object.prototype.num = 30;
        var a1 = new Aaa();
        alert(a1.num); // 30</script>      

其实就是首先在①处查找，①处没有，