JavaScript 什么是原型链?

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

下面咱们演示个小例子来讲明原型链

function Aaa() {

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

你们可能会想，为何这个对象a1能够找到num
一、首先你们发现这个num并非挂载到a1的对象下面，而是挂载到构造函数的原型下面
二、那么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>

其实就是首先在①处查找，①处没有，
在顺着原型链在②处查找，②处也没有，
因而继续向上查找，在③处Object.prototype下去查找num，查到了，而且将num的值弹出来