弄清原型链继承那点事

一起来理解下原型链继承！

1. proto、_ _ proto _ _、prototype 是什么？ （敲黑板！划重点！）

proto:  只要是对象都有这个属性，这个属性提供一个指针指向其构造函数的原型。
__proto__ :  chrome浏览器对proto属性的定义，就是说在chrome里 proto就叫__proto__,IE不认识它。
prototype: 原型属性，只有函数对象才有的属性。

2. 原型链继承 怎么继承 ？

将子类的原型指向到父类构造函数的实例。

// 先定义个父类
function Father({age, name}) {
  this.name = name;
  this.age = age;
}
Father.prototype.getAge = function() {
 console.log(this.age, '年龄');
}
const aFather = new Father({name: '小头爸爸', age: 40 });  // 实例化
aFather.getAge();

image.png

// 再来个子类
function MakeChild({age, name}) {
  this.name = name;
  this.age = age;
}
MakeChild.prototype = aFather;  // 子类的prototype指向父类的实例化。
const aChild = new MakeChild({name: '大头儿子', age: 6});
console.log(aChild.name, aChild.age);
aChild.getAge();

image.png

3. 验证一下 proto指向

我们可以清楚看到，对象的proto属性总是指向其构造函数的原型，在继承关系中，子类实例化出来的对象，aChild 它的proto属性指向其构造函数MakeChild的prototype，而MakeChild的prototype指向父类实例化aFather。

image.png

4.总结一下

• 继承的是父类的原型里的属性，私有属性不能继承。
• 函数对象的proto指向一个空函数。
• 由proto串起来的路径就是原型链。

• 原型链查找的终点是Object. _ _ proto _ _， 指向一个空函数

  
  
  image.png