原型链初解

@前端

原型链

1.看下面一段代码

function Computer(color,price,brand,name) {
        this.color = color;
        this.price = price;
        this.brand = brand;
        this.name = name;
    }
    Computer.prototype.playGame = function () {
        console.log('玩游戏');
    };
    var c1 = new Computer('black',10000,'戴尔','雷神');
    console.log(c1);//输出Computer {color: "black", price: 10000, brand: "戴尔", name: "雷神"}
    c1.playGame();//玩游戏

我们可以看到c1作为构造函数Computer的实例化对象，输出c1为传参数后的实例化对象，也可以访问Computer构造函数上添加的方法，那么它是怎么访问到的呢？
这就引出了原型链的概念。
2.什么是原型和原型对象？
原型和原型对象: 实例对象中的__proto__叫隐式原型,构造函数中的prototype叫显示
原型,原型存储的是一个对象,所以叫原型对象,我们通过显示原型对原型对象进行操作,
隐式原型通常用来读取。
上图代码图解：

		Computer作为构造函数。他自身有一个显示的原型prototype指向他的原型对象的地址（0x200）,
		Computer构造函数，new了一个实例化对象c1,实例化对象上有一个隐式的_proto_也指向他的原型对象
		的地址（0x200）,原型对象上的构造函数指向自己的构造函数。

所以 Computer.prototype.playGame = function () {
console.log(‘玩游戏’);
};
构造函数通过显示原型prototype在原型对象上面添加了playGame方法，所以实例化对象c1能通过自身**隐式原型_proto_**访问到原型对象上面新添加的方法。

3.原型链的基本概念
原型链:
实例对象在调用属性和方法时,先调用自身中的,如果没有,去当前类型的原型对象中
去找,如果还没有去,Object的原型对象中去找,如果还没有,是undefined.
由于原型对象是一个Object类型的实例对象,所以会去Object的原型对象中去找,由于Object
原型对象已经到尽头了,所以Object原型对象的原型对象是null。
图解原型链：

Object构造函数，自身有一个显示原型prototype，指向自己的原型对象(0x500),原型对象（0x500）上的构造器指向Object构造函数。
所有原型对象都是Object new出来的，所以（0x200）身上都有一个隐式的原型_proto_,
隐式原型_proto_指向Object的原型对象(0x500),原型对象(0x500)也是Object new出来的，最终指向为null。

  var obj =new Object();
  console.log(obj.__proto__);//{constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
  console.log(obj.__proto__.__proto__);//null

看上面的代码，obj为Object的实例化对象，所以obj身上有一个隐式的_proto_,obj._proto_指向本身(0x500)的原型对象，后面继续._proto时，就找不到了，所以为null。