es6中如何实现继承

魁首哥

作者

es6中如何实现继承

本篇内容介绍了“es6中如何实现继承”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！

es6中如何实现继承

在es6中，可利用class关键字配合extends关键字来实现继承。ES6中引入了class关键字来声明类，而class（类）可通过extends来继承父类中属性和方法，语法“class 子类名 extends 父类名{...};”。

本教程操作环境：windows7系统、ECMAScript 6版、Dell G3电脑。

es6中可利用class关键字配合extends关键字来实现继承

在ES6中，class (类)作为对象的模板被引入，可以通过 class 关键字定义类。

es6继承

Class 可以通过extends关键字实现继承

classAnimal{}classCatextendsAnimal{};

上面代码中定义了一个 Cat 类，该类通过 extends关键字，继承了 Animal 类中所有的属性和方法。但是由于没有部署任何代码，所以这两个类完全一样，等于复制了一个Animal类。下面，我们在Cat内部加上代码。

classCatextendsAnimal{constructor(name,age,color){//调用父类的constructor(name,age)super(name,age);this.color=color;}toString(){returnthis.color+''+super.toString();//调用父类的toString()}}

constructor方法和toString方法之中，都出现了super关键字，它在这里表示父类的构造函数，用来新建父类的this对象。

需要注意的是：class 关键字只是原型的语法糖， JavaScript 继承仍然是基于原型实现的。

classPet{constructor(name,age){this.name=name;this.age=age;}showName(){console.log("调用父类的方法");console.log(this.name,this.age);}}//定义一个子类classDogextendsPet{constructor(name,age,color){super(name,age);//通过super调用父类的构造方法this.color=color;}showName(){console.log("调用子类的方法");console.log(this.name,this.age,this.color);}}

优点：