美文网首页
ES6-Class的继承

ES6-Class的继承

作者: 自律财富自由 | 来源:发表于2020-01-19 16:47 被阅读0次

1、基本语法

  • ES6中的继承直接通过extends关键字来实现继承;
  • 子类的constructor中必须显示调用super()方法。
class A {}
class B extends A {
  constructor () {
    super();
  }
}

在子类的constructor中调用了super()方法之后,才会生成子类的this对象。
因此,this对象的使用只能放在super()方法之后调用。

2、使用Object.getPrototypeOf()获取子类的父类

Object.getPrototypeOf(B) === A // true

3、super关键字的使用

super关键字有两种使用方法:

  • 作为super方法来调用,生成子类实例并实现继承;代表父类的构造函数;
    注意,super虽然代表了父类A的构造函数,但是返回的是子类B的实例;
    即super内部的this指的是B的实例;
    作为 #函数# 时,super()只能用在子类的构造函数之中,用在其他地方(比如实例方法)就会报错。

    image.png
  • 作为super对象来使用, 代表父类对象
    super作为对象在普通方法或者constructor中使用时,指向父类的原型对象;
    因此在普通方法或者constructor中,是无法通过super对象来调用父类实例上的属性和方法的

    image.png
image.png

super作为对象在静态方法中使用时,指向父类;

image.png

在子类的静态方法中通过super调用父类的方法时,方法内部的this指向当前的子类,而不是子类的实例

image.png

由于对象总是继承其他对象的,所以可以在任意一个对象中,使用super关键字

image.png

4、类的 prototype 属性和proto属性

记住两条规则即可:

  • 子类的proto属性,表示构造函数的继承,指向父类(因为class语法表示的是构造函数,而函数自带prototype属性)
    B.__proto__ === A
  • 子类的prototype的proto属性,表示方法的继承,指向父类的prototype(因为class内部的方法都是定义在原型上的)
    B.prototype.__proto__ === A.prototype

相关文章

  • ES6-Class的继承

    1、基本语法 ES6中的继承直接通过extends关键字来实现继承; 子类的constructor中必须显示调用s...

  • ES6-class的继承

    Classk可以通过extends关键字实现继承;这比ES5的通过修改原型链实现继承,要清晰和方便很多; 上面的代...

  • ES6-class

    javascript的语言传统方法是通过构造函数,定义并生成新的对象: function point(x,y){ ...

  • ES6-Class

    (参考自秒味课堂的视频讲解) Class 1.ES5中的原型 const Miaov = function ( )...

  • ES6-Class

    Class 的基本语法 ECMAScript 的原生构造函数大致有下面这些: Boolean() Number()...

  • ES6-class

    取值函数和存值函数; class MyClass{ constructon(){} get prop(){ ret...

  • ES6-class

  • ES6-class

    ES6提供了更接近传统语言的写法,引入了class(类)这个概念。新的class写法让对象原型的写法更加清晰、更像...

  • es6-class的使用

    1\class的简介:ES6 的类,完全可以看作构造函数的另一种写法。 class Point {// ...} ...

  • es6-class类

    1. 类的基本用法 es5造类 es6造类 2. 类的继承 使用extends关键字

网友评论

      本文标题:ES6-Class的继承

      本文链接:https://www.haomeiwen.com/subject/ncprzctx.html