ES5、ES6 中继承的几种写法

用户头像
Manito
关注
发布于: 2020 年 07 月 08 日

ES6中的class继承

class是一种语法糖,内部还是基于原型继承的方法。使用class代码易读



class Person{
constructor(name) {
this.name = name
this.privateFunc = function() {console.log(this.name)} // 私有方法
}
hello() {
console.log(this.name)
}
}
class Student extends Person {
constructor(name, grade) {
super(name) // 继承父类的属性及方法
this.grade = grade
}
}



ES6中的原型继承



function Person(name) {
this.name = name
this.privateFunc = function() {console.log(this.name)} // 私有方法
}
// 原型方法
Person.prototype.hello = function() {console.log(this.name)}
function Student(name, grade) {
Person.call(this, name) // 继承父类的属性/方法 => name属性及privateFunc方法
this.grade = grade
}
// 继承父类的原型
Student.prototype = Object.create(Person.prototype)
Student.prototype.constructor = Student // 绑定正确的构造函数,防止被父类构造器覆盖



ES5中的原型继承

Object.create是ES6中的语法,只需要将上面的写法修改一下即可。需要借助中间对象来实现prototype的继承关系。



// 继承父类的原型
- Student.prototype = Object.create(Person.prototype)
+ function DummyPerson {}
+ DummyPerson.prototype = Person.prototype
+ Student.prototype = new DummyPerson



发布于: 2020 年 07 月 08 日 阅读数: 31
用户头像

Manito

关注

还未添加个人签名 2019.10.08 加入

还未添加个人简介

评论

发布
暂无评论
ES5、ES6中继承的几种写法