class继承

// 继承Person类中的sayHi方法
class Person {
    sayHi(){
        console.log("hello");
    }
}

class Chinese extends Person {}


// 继承Person类中的属性和方法
class Person {
    constructor(name, age, gender){
        this.name = name;
        this.age = age;
        this.gender = gender;
    }

    sayHi(){
        console.log("hello");
    }
}

// 子类
class Chinese extends Person {
    constructor(name, age, gender, skin){
        // 在子类中，必须在constructor函数中，首先调用super()
        super(name, age, gender);	// 相当于Person.call(this,name,age,gender)
        // 调用super之后才可以去写其他代码
        this.skin = skin;
    }
}
let xm = new Chinese("xm", 20, "male", "黄");
console.log(xm);
xm.sayHi();

class Point {
}

class Student extends Point {
}

上面示例中，Point是父类，Student是子类，它通过extends关键字，继承了Point类的所有属性和方法。但是由于没有部署任何代码，所以这两个类完全一样，等于复制了一个Point类。

下面，我们在Student内部加上代码。

class Point { /* ... */ }
​
class Student extends Point {
  constructor(x, y, color) {
    super(x, y); // 调用父类的constructor(x, y)
    this.color = color;
  }
​
  toString() {
    return this.color + ' ' + super.toString(); // 调用父类的toString()
  }
}

上面示例中，constructor()方法和toString()方法内部，都出现了super关键字。super在这里表示父类的构造函数，用来新建一个父类的实例对象。

ES6 规定，子类必须在constructor()方法中调用super()，否则就会报错。这是因为子类自己的this对象，必须先通过父类的构造函数完成塑造，得到与父类同样的实例属性和方法，然后再对其进行加工，添加子类自己的实例属性和方法。如果不调用super()方法，子类就得不到自己的this对象。

class Point { /* ... */ }
​
class Student extends Point {
  constructor() {
  }
}
​
let cp = new Student(); // ReferenceError

class Foo {
  constructor() {
    console.log(1);
  }
}
​
class Bar extends Foo {
  constructor() {
    super();
    console.log(2);
  }
}
​
const bar = new Bar();
// 1
// 2

class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
}
​
class ColorPoint extends Point {
  constructor(x, y, color) {
    this.color = color; // ReferenceError
    super(x, y);
    this.color = color; // 正确
  }
}

class ColorPoint extends Point {
}
​
// 等同于
class ColorPoint extends Point {
  constructor(...args) {
    super(...args);
  }
}

有了子类的定义，就可以生成子类的实例了。

let cp = new ColorPoint(25, 8, 'green');
​
cp instanceof ColorPoint // true
cp instanceof Point // true

class A {
  static hello() {
    console.log('hello world');
  }
}
​
class B extends A {
}
​
B.hello()  // hello world

class Foo {
  #p = 1;
  #m() {
    console.log('hello');
  }
}
​
class Bar extends Foo {
  constructor() {
    super();
    console.log(this.#p); // 报错
    this.#m(); // 报错
  }
}

class Foo {
  #p = 1;
  getP() {
    return this.#p;
  }
}
​
class Bar extends Foo {
  constructor() {
    super();
    console.log(this.getP()); // 1
  }
}

super关键字 

class A {}
​
class B extends A {
  constructor() {
    super();
  }
}

class A {
  constructor() {
    console.log(new.target.name);
  }
}
class B extends A {
  constructor() {
    super();
  }
}
new A() // A
new B() // B

class A {}
​
class B extends A {
  m() {
    super(); // 报错
  }
}

class A {
  p() {
    return 2;
  }
}
​
class B extends A {
  constructor() {
    super();
    console.log(super.p()); // 2
  }
}
​
let b = new B();

class A {
  constructor() {
    this.p = 2;
  }
}
​
class B extends A {
  get m() {
    return super.p;
  }
}
​
let b = new B();
b.m // undefined

class A {}
A.prototype.x = 2;
​
class B extends A {
  constructor() {
    super();
    console.log(super.x) // 2
  }
}
​
let b = new B();

class A {
  constructor() {
    this.x = 1;
  }
  print() {
    console.log(this.x);
  }
}
​
class B extends A {
  constructor() {
    super();
    this.x = 2;
  }
  m() {
    super.print();
  }
}
​
let b = new B();
b.m() // 2

class A {
  constructor() {
    this.x = 1;
  }
}
​
class B extends A {
  constructor() {
    super();
    this.x = 2;
    super.x = 3;
    console.log(super.x); // undefined
    console.log(this.x); // 3
  }
}
​
let b = new B();

class Parent {
  static myMethod(msg) {
    console.log('static', msg);
  }
​
  myMethod(msg) {
    console.log('instance', msg);
  }
}
​
class Child extends Parent {
  static myMethod(msg) {
    super.myMethod(msg);
  }
​
  myMethod(msg) {
    super.myMethod(msg);
  }
}
​
Child.myMethod(1); // static 1
​
var child = new Child();
child.myMethod(2); // instance 2

class A {
  constructor() {
    this.x = 1;
  }
  static print() {
    console.log(this.x);
  }
}
​
class B extends A {
  constructor() {
    super();
    this.x = 2;
  }
  static m() {
    super.print();
  }
}
​
B.x = 3;
B.m() // 3

class A {}
​
class B extends A {
  constructor() {
    super();
    console.log(super); // 报错
  }
}

class A {}
​
class B extends A {
  constructor() {
    super();
    console.log(super.valueOf() instanceof B); // true
  }
}
​
let b = new B();

var obj = {
  toString() {
    return "MyObject: " + super.toString();
  }
};
​
obj.toString(); // MyObject: [object Object]