JavaScript学习-原型和原型链

原型和原型链

• 示例代码

//创建一个Person类
class Person {
  constructor(name) {
    this.name = name;
  }

  drink() {
    console.log('喝水');
  }
}
//创建一个Teacher类，继承Person
class Teacher extends Person {
  constructor(name, subject) {
    super(name);
    this.subject = subject;
  }

  teach() {
    console.log(`我是${this.name},教${this.subject}.`)
  }
}

const teacher = new Teacher(`小明`,`英语`);
console.log(`teacher`, teacher);
teacher.teach();
teacher.drink();

解释

• 原型链有显示原型和隐式原型两个概念，如以上代码可以这么理解，
• Person类是第一个类，因此它里面的所有方法看作显式原型，
• 然后是Teacher类，继承了Person类，因此Person类里面的显式原型变成了Teacher类里面的隐式原型，
• 然后嘞，teacher是被Teacher给new出来的，因此Teacher里面的teach()方法就是teacher的隐式原型，而teacher的显式原型是自己的name、subject两个参数。
• 就比如说上述代码的最后两行的调用，teacher本身没有的就会去隐式原型里面去找，找不到又去上一层找，因此就类似于一条链条，所以叫做原型链，以下图示看起来就类似于指针。
• 或许换通俗一点的话来说，自己有的就是自己的显示原型，自己没有的，但是可以通过渠道调用别人的就是自己的隐式原型。
• 那还有一个方法可以验证该属性或者方法是不是自身的，例如输入teacher.hasOwnProperty(‘name’)，会返回一个true，而输入teacher.hasOwnProperty(‘teach’)，会返回false。
• 关于图示中的Object，几乎所有的对象都是Object的实例，也就是说他们都继承自Object.prototype,Object.prototype是原型链的顶端，它包含一些基本的方法和属性，所有的对象都可以访问这些方法和属性。呐，因此我们也可以说Object里面的方法是Person类的隐式原型，如下图所示。
• 图示