JS：原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

JS：原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

一、原型链
1、原型链：
每个对象都可以有一个原型_proto_，这个原型还可以有它自己的原型，以此类推，形成一个原型链。查找特定属性的时候，我们先去这个对象里去找，如果没有的话就去它的原型对象里面去，如果还是没有的话再去向原型对象的原型对象里去寻找… 这个操作被委托在整个原型链上，这个就是我们说的原型链了。
2 prototype和constructor

• prototype属性，它是函数所独有的，它是从一个函数指向一个对象。
• 每个函数都有一个原型对象，该原型对象有一个constructor属性，指向创建对象的函数本身。

3.构造函数的prototype属性是它的实例的原型

function People(name, age, sex){
    this.name = name;
    this.age = age;
    this.sex = sex; 
}
//实例化
var xiaoming = new People('小明', 12, '男');
//测试三角关系是否存在
console.log(xiaoming.__proto__ === People.prototype);
//true

二、原型链查找
JavaScript规定：实例可以打点访问它的原型的属性和方法，这被称为“原型链查找”

function People(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
// 往原型上添加nationality属性
People.prototype.nationality = '中国';

var xiaoming = new People('小明', 12, '男');

console.log(xiaoming.nationality);      // 中国
console.log(xiaoming);

三、原型链遮蔽

function People(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
// 往原型上添加nationality属性
People.prototype.nationality = '中国';

// 实例化
var xiaoming = new People('小明', 12, '男');
var tom = new People('汤姆', 10, '男');
tom.nationality = '美国';

console.log(xiaoming.nationality);      // 中国
console.log(xiaoming);

console.log(tom.nationality);           // 美国
//tom本身有nationality时，就不找原型上的nationality属性了，原型链的遮蔽效应
//跟局部变量全局变量差不多

四、原型链的终点

People.prototype是对象，因为object是所有对象的构造函数，那么这个对象就是object的实例，可以看做是object new出来的，构成了三角关系

那么小明就可以顺着原型链寻找到定义在原型链终点的这个对象上的方法

function People(name, age){
	this.name = name;
    this.age = age;
}
var xiaoming = new People('小明', 12);

console.log(xiaoming.__proto__.__proto__ === Object.prototype);  //true
console.log(Object.prototype.__proto__);      // null 说明是原型链终点

var char = xiaoming.toString();
console.log(char);

console.log(Object.prototype.hasOwnProperty('hasOwnProperty'));  //true
console.log(Object.prototype.hasOwnProperty('toString'));   //true
//说明hasOwnProperty和toString都是定义在Object.prototype上的

五、关于数组的原型链

var arr = [344, 45, 34, 23]; //一个普通数组

console.log(arr.__proto__ === Array.prototype);                 // true
console.log(arr.__proto__.__proto__ === Object.prototype);      // true
console.log(Array.prototype.hasOwnProperty('push'));            // true
console.log(Array.prototype.hasOwnProperty('splice'));          // true