class继承(ES6)

1.简介

ES6 Class可以通过extends关键字进行继承,较es5必须通过原型链进行继承方便很多

class Point{
}
class colorPoint extends Point{
}
新创建的类colorPoint 通过关键字extends继承了父类构造函数Point所有属性和方法
class colorPoint extends Point{
  constructor(x,y,color){
    super(x,y);//super代表父类的构造函数,必须在子类的constuctor方法中调用,因为子类没有自己的this对象,而是继承自父类的,然后对其进行加工
    this.color=color;
  }
  toString(){
    return this.color+""+super.toString()
  }
}
}

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

class Point{
  static hell0(){
    console.log("hello,world")
  }
}
class exPoint extends Point{
}
exPoint.hell();// hello,world

2.Object.getPrototypeOf()

该方法用来从子类获取父类,以判断一个类是否继承了另一个类

Object.getPrototypeOf(colorPoint)==point;//true
3.super关键字

super关键字既可以当函数使用,也可以当对象使用

第一种情况,super当函数使用时,代表父类的构造函数,es6规定,必须在子类constructor方法中调用一次super函数;

class A {}

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

注意:super虽然代表父类的构造函数,但是返回的是子类的实例,也就是super内部指向的是B,super()相当于Aaa.prototype.constructor.call(this)

第二种情况,super作为对象时,普通方法中,指向父类的原型对象,静态方法中,指向父类

class Aaa{
  p(){
    return 1;
  }
}
class Baa extends Aaa{
  constructor(){
    super();
    console.log(super.p())//1
  }
}
let b = new Bbb();

注意:1.此处super作为对象使用,指向Aaa的原型,即Aaa.prototype,

2.定义在父类实例上的属性和方法,是无法通过super调用的,需通过原型prototype上


ES6规定,在子类普通方法中调用super方法时,super方法内部this指向当前子类的实例

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

b.m()虽然调用的父类的方法,但是A.prototype.print()内部this指向的子类B的实例,实际上执行的是super.print.call(this)

在子类构造函数中,给super赋值即等于给this赋值

4.类的prototype属性和__proto__属性

类同时有prototype属性和__proto__属性

(1)子类的__proto__属性,表示构造函数的继承,总是指向父类

(2)子类prototype属性的__proto__属性,表示方法的继承,总是指向父类的prototype属性

5.原生构造函数的继承

Boolean();Number();String();Array();Date();Function();RegExp();Error();Object()



                
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值