class继承

class ColorPoint extends Point {
  constructor(x, y, color) {
    super(x, y); // 调用父类的constructor(x, y)
    this.color = color;
  }

  toString() {
    return this.color + ' ' + super.toString(); // 调用父类的toString()
  }
}

子类必须在constructor方法中调用super方法,否则新建实例时会报错

class Point { /* ... */ }

class ColorPoint extends Point {
  constructor() {
  }
}

let cp = new ColorPoint(); // ReferenceError

ES5 的继承,实质是先创造子类的实例对象this,然后再将父类的方法添加到this上面(Parent.apply(this))。ES6 的继承机制完全不同,实质是先创造父类的实例对象this(所以必须先调用super方法),然后再用子类的构造函数修改this。

父类的静态方法,也会被子类继承

class A {
  static hello() {
    console.log('hello world');
  }
}

class B extends A {
}

B.hello()  // hello world

class A {}

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

super内部的this指向的是B

class A {}

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


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.class可以通过extends关键字实现继承,比es5的通过修改原型链实现继承,要清晰和方便。 子类必须在c...
    ningluo阅读 253评论 0 1
  • 文章来源阮一峰ES6入门,这里做要点掌握大纲。class——构造函数的语法糖ES5的继承:修改原型链先创造子类的实...
    宋乐怡阅读 1,605评论 0 0
  • 这是16年5月份编辑的一份比较杂乱适合自己观看的学习记录文档,今天18年5月份再次想写文章,发现简书还为我保存起的...
    Jenaral阅读 2,823评论 2 9
  • 1.构造函数,原型,实例之间的关系 每个构造函数都有一个原型对象(prototype属性),原型对象都包含一个指向...
    秦小婕阅读 877评论 0 0
  • 简介 Class可以通过extends关键字实现继承。 上面代码定义了一个ColorPoint类,该类通过exte...
    oWSQo阅读 683评论 0 1