ES6躬行记（21）——类的继承

　　ES6的继承依然是基于原型的继承，但语法更为简洁清晰。经过一个extends关键字，就能描述两个类之间的继承关系（以下代码所示），在此关键字以前的Man是子类(即派生类)，而在其以后的People是父类（即基类或超类）。

class People {
  constructor() {
    this.age = 28;
  }
  getAge() {
    return this.age;
  }
  static getName() {
    return "strick";
  }
}
class Man extends People {
  constructor() {
    super();
  }
}
var man = new Man();
Man.getName();          //"strick"
man.getAge();           //28

　　由上面的代码可知，子类能继承父类的静态方法和原型方法，而诸如访问器属性、生成器等父类的其它成员也是能继承的。不只如此，extends关键字右侧继承的不仅仅是类，还能够是函数、内置对象，甚至是表达式，只要其计算结果合法就行。而合法与否的衡量准则，就是ES6对父类的要求，必须是含构造函数的对象，即能与new运算符组合的对象，像空的对象字面量（{}）、null、undefined和生成器等都是不容许的。

　　在Man类的构造函数中调用了一次super()方法，这是为了能更方便的操做父类而引入的新特性。而super是个特殊的关键字，在类中拥有双重身份，既是方法也是对象，关于对象身份的用法在第5篇中曾有过介绍。

1、super

　　当super做为方法使用时，有如下六个注意点。

（1）super()方法至关于父类的构造函数。

（2）只有在子类的构造函数中才能调用super()方法。

（3）若是子类显式地定义了构造函数，那么必须调用super()方法，不然会报错。

（4）若是子类没有定义构造函数，那么会自动调用super()方法。

（5）当子类的构造函数显式地返回一个对象时，就能避免调用super()方法。

（6）在使用this以前，必须先调用super()方法。

1）第五个注意点

　　下面用一个示例来描述第五个注意点，限于篇幅省略了父类People的声明。在子类Man的构造函数中注释了super()方法，并将其返回结果改为了一个空对象，这段代码可以正确执行。

class Man extends People {
  constructor() {
    //super();
    return {};
  }
}

2）第六个注意点

　　关于第六个注意点，之因此要这么限制，主要和this的初始化有关。调用super()方法不只能执行父类的构造函数，还能初始化父类的this。而ES6对两个类的this的初始化顺序作了规定，先父类，再子类，所以super()方法要在使用this以前调用。还有一点要注意，就是子类的this会合并父类的this的属性和方法，以下代码所示，在父类People中初始化的自有属性age，能在子类Man中访问。

class People {
  constructor() {
    this.age = 28;
  }
}
class Man extends People {
  constructor() {
    super();
    console.log(this.age);      //28
  }
}
var man = new Man();

3）对象身份

　　当super做为对象使用时，在不一样的位置，其指向将不一样，具体分为两种状况，以下所列。

（1）若是在子类的原型方法中使用super，那么super指向父类的原型。

（2）若是在子类的静态方法中使用super，那么super指向父类。

　　下面是一个演示super指向的示例，父类People包含两对同名方法，一个是原型方法，另外一个是静态方法；子类Man包含两个只读的访问器属性，其中name是静态的访问器属性。

class People {
  getAge() {
    return 28;
  }
  static getAge() {
    return 30;
  }
  getName() {
    return "freedom";
  }
  static getName() {
    return "strick";
  }
}
class Man extends People {
  get age() {
    return super.getAge();
  }
  static get name() {
    return super.getName();
  }
}
var man = new Man();
man.age;               //28
Man.name;              //"strick"

　　由两个访问器属性的读取结果可知，super的指向符合所列的两种状况。注意，像下面这样使用super，会抛出语法错误，由于此处的super没法明确说明本身的身份究竟是方法仍是对象。

class Man extends People {
  getName() {
    console.log(super);
  }
}

2、表达式

　　ES6容许extends关键字的右侧是一个表达式，这使得子类的继承更加灵活，能动态地选择父类，下面用一个示例演示表达式的妙用。

function getPeople(gender) {
  return gender == 1 ? Man : Woman;
}
class Man { }
class Woman { }
class Person extends getPeople(1) { }
var person = new Person();
person instanceof Man;        　//true
person instanceof Woman;      　//false

　　在代码中先声明三个类，其中Man和Woman是父类，Person是子类，再调用能根据参数返回不一样类的getPeople()函数，获得的返回值是Man类。经过instanceof运算符的计算结果可知，Person类继承的正是Man类。

1）mixin

　　类的这个特性还能解决没法多重继承的问题，以下所示。

function mixin(...objects) {
  function middle() {}
  Object.assign(middle.prototype, ...objects);
  return middle;
}
var man = {
  getMan() {
    return "男";
  }
};
var woman = {
  getWoman() {
    return "女";
  }
};
class Person extends mixin(man, woman) { }
var person = new Person();
person.getMan();        　　//"男"
person.getWoman();      　　//"女"

　　在代码中先初始化两个对象：man和woman，而后调用mixin()函数，将两个对象的方法合并到内部函数middle()的原型上，最后让Person类继承middle()函数，这样就能调用两个对象中的方法了。

　　这种将多个对象或类合并成一个，间接实现多重继承的做法叫作类的模板，也叫抽象子类或mixin（混合）。

3、内置对象

　　在ES5时代，像Array、Error等内置对象是不能被继承的，而ES6突破了这个限制，由于ES6的子类能经过this访问父类的内部属性和方法，这样就能继承内置对象的全部功能。以数组为例，模拟的子类没法自动更新length属性，而ES6的子类就不会有这个问题，以下所示。

class List extends Array { }
var list = new List();
list.length;        //0
list.push("a");
list.length;        //1

4、Symbol.species

　　在内置对象中，有些方法能返回本身的实例，例如数组的map()、slice()等。当子类继承了内置对象后，这类方法的返回值会被替换成子类的实例，具体以下所示。

class List extends Array { }
var list = new List(1, 2),
  segment = list.slice(0, 1);   //List [1]
segment instanceof List;        //true

　　接下来简单分析一下这其中的原因。在每一个内置对象中，都有一个静态的只读访问器属性（相似于下面的代码），其名称是内置符号Symbol.species，返回值是this。

class Array {
  static get [Symbol.species]() {
    return this;
  }
}

　　当调用内置对象中的方法时，若是返回值是实例，那么就会先访问Symbol.species属性，肯定要实例化哪一个类。而根据ES6的规则可知，当子类调用父类的静态方法时，方法中的this指向的是子类，从而就能证实子类在调用内置对象的某些方法时，能获得自身的实例。

　　若是想要内置对象的这些方法仍然返回它们自身的实例，那么就须要在子类中也声明一个相同的只读访问器属性，并返回相应的内置对象，以此屏蔽父类中的同名属性。下面的代码和上一个示例相似，只是给子类增长了Symbol.species属性。

class List extends Array {
  static get [Symbol.species]() {
    return Array;
  }
}
var list = new List(1, 2),
  segment = list.slice(0, 1);   //[1]
segment instanceof List;        //false

5、new.target

　　元属性new.target曾在第14篇中作过讲解，本节会介绍元属性在父类中的行为，以下所示。

class People {
  constructor() {
    new.target === People;     //false
    new.target === Man;        //true
  }
}
class Man extends People { }
var man = new Man();

　　在上面的代码中，Man是子类，People是父类，在父类的构造函数中对new.target作了两次比较，从两次的比较结果中可知，此时的new.target指向的是子类。