Javascript 继承

在 es5 中，我们通过原型链的方式来实现继承：

var objA = function () {
  // TODO
}

objA.prototype = {
  constructor: objA,
  // TODO
}

var objB = function () {
  // TODO
}

objB.prototype = new objA()

通过以上方式我们便让objB继承了objA，objB拥有了objA的全部属性，并且可以重写其继承的属性，但objA还是原来的objA，其属性不受objB的重写影响。

现在 es6 中提出了 class （类）概念，我们可以将上面的代码改写：

class objA {
  constructor () {
    // TODO
  }
}

class objB extends objA {
    constructor () {
        super(...)
        // TODO
    }
}

此时，objB 通过 extends 关键字继承了 objA。

详解：

extends 子类的继承
super(); 调用父类的构造方法，只能在子类中执行

继承可以让子类获得父类的方法、属性，可以扩充、增加新的方法、属性，也可重写继承的方法、属性等

• 父类（基类）—— 被继承的类
• 子类 —— 继承后的类

1. extends（关键字） 继承 —— class 子类类名 + extends + 要继承的类名
2. super(参数); 调用父类构造函数，只能在子类中执行；必须 在类中的构造函数constructor中使用super()且 必须 在this前；super 中的参数是传给父类的；
3. 子类可以调用父类的方法、属性；
4. 父类不能调用子类的方法、属性。

super 不仅可以用来访问对象的原型，还可以作为父类的构造函数来调用，所以在继承的时候，在子类的constructor中，调用super方法，可以让子类把父类的属性和方法继承过来，这样子类才会拥有父类的属性和方法（走一遍父类的属性，就是为了继承它们）。

在class的继承中，只能使用super，不能使用“Object.setPrototypeOf()”，这是es6规定好的语法，我们只能按照它的规定来写，将其当成固定的语法记住就行。

定义在类中的方法是添加到当前类对应的原型对象上，并不会影响到父类，所以其他子类也无法使用第一个子类中的方法。

一般在class类中，this指向实例化后的对象。

示例代码

/**
 * person 类
 */
class person {
  name = null;
  age = null;
  sex = null;
  phone = null;
  
  constructor (name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
  }
}

/**
 * student 类 继承 person 类
 */
class student extends person {
  classes = null;
  performance = null;

  constructor (name, age, sex, classes) {
    // 在进入函数的时候，立即调用 super() 函数
    super(name, age, sex);
    this.classes = classes;
  }

  // student 类的函数
  setYuWenPerformance (performance) {
    this.performance = performance;
  }
}

// 实例化一个 person 为 lisa
let lisa = new person('lisa', 15, 'male');
console.log(lisa)
// person {name: "lisa", age: 15, sex: "male", phone: null}

// 修改 lisa 的属性
lisa.phone = '+86-13401234567'
console.log(lisa)
// person {name: "lisa", age: 15, sex: "male", phone: "+86-13401234567"}

// 实例化一个 student 为 jay
let jay = new student('jay', 12, 'female', 'class 6-1');
console.log(jay)
// student {name: "jay", age: 12, sex: "female", phone: null, classes: "class 6-1", performance: null}

// 调用 jay (student) 的函数
jay.setYuWenPerformance(96);
console.log(jay)
// student {name: "jay", age: 12, sex: "female", phone: null, classes: "class 6-1", performance: 96}