本篇内容介绍了“es6中如何实现继承”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!
我们提供的服务有:做网站、成都网站设计、微信公众号开发、网站优化、网站认证、柳江ssl等。为上千企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的柳江网站制作公司
在es6中,可利用class关键字配合extends关键字来实现继承。ES6中引入了class关键字来声明类, 而class(类)可通过extends来继承父类中属性和方法,语法“class 子类名 extends 父类名{...};”。
本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。
es6中可利用class关键字配合extends关键字来实现继承
在ES6中,class (类)作为对象的模板被引入,可以通过 class 关键字定义类。
es6继承
Class 可以通过extends关键字实现继承
class Animal {} class Cat extends Animal { };
上面代码中 定义了一个 Cat 类,该类通过 extends关键字,继承了 Animal 类中所有的属性和方法。 但是由于没有部署任何代码,所以这两个类完全一样,等于复制了一个Animal类。 下面,我们在Cat内部加上代码。
class Cat extends Animal { constructor(name, age, color) { // 调用父类的constructor(name, age) super(name, age); this.color = color; } toString() { return this.color + ' ' + super.toString(); // 调用父类的toString() } }
constructor方法和toString方法之中,都出现了super关键字,它在这里表示父类的构造函数,用来新建父类的this对象。
需要注意的是:class 关键字只是原型的语法糖, JavaScript 继承仍然是基于原型实现的。
class Pet { constructor(name, age) { this.name = name; this.age = age; } showName() { console.log("调用父类的方法"); console.log(this.name, this.age); } } // 定义一个子类 class Dog extends Pet { constructor(name, age, color) { super(name, age); // 通过 super 调用父类的构造方法 this.color = color; } showName() { console.log("调用子类的方法"); console.log(this.name, this.age, this.color); } }
优点:
清晰方便
缺点:
不是所有的浏览器都支持 class。
“es6中如何实现继承”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站,小编将为大家输出更多高质量的实用文章!
网页标题:es6中如何实现继承
分享路径:http://lswzjz.com/article/jhcooe.html