今天我总结了继承的方式,和大家探讨一下
一、es6中的类继承:
这种方式使用起来比较简单,也我喜欢的一种方式,它的继承依靠关键字extends
,其实这只是一种语法糖,其本质还是原型继承。
代码如下:
// es6中的类继承
class Parents {
constructor (name, age) {
this.name = name
this.age = age
}
toString () {
console.log(`您的名字是${this.name},您的年龄为:${this.age}`)
}
}
class Son extends Parents {
constructor (name, age, mheight) {
super(name, age)
this.mheight = mheight
}
myString () {
console.log(`您的名字是${this.name},您的年龄为:${this.age}, 身高为${this.mheight}`)
}
}
let son = new Son('小雪', 20, "162cm")
son.toString() // 您的名字是小雪,您的年龄为:20
son.myString() // 您的名字是小雪,您的年龄为:20, 身高为162cm
从结果可以看出Son通过extends
既拥有自己的属性mheight
和方法myString()
,又拥有Parents的属性name
、age
和方法toString()
二、借助构造函数实现继承:
function Parent1 () {
this.name = 'parent1'
}
function Child1 () {
Parent1.call(this)
this.type = 'child1'
}
console.log(new Child1)
这种继承方式无法无法继承父级原型上的属性和方法
三、 借助原型链实现继承:
function Parent2 () {
this.name = 'parent2'
this.play = '123'
}
function Child2 () {
this.type = 'child2'
}
Child2.prototype = new Parent2()
const s1 = new Child2();
const s2 = new Child2();
console.log(s1.play, s2.play)
由于两个实例对象是同一个对象,所以改变一个的值另一个也会变
四、 组合方式实现继承:
function Parent5 () {
this.name = 'parent5'
this.play = [1, 2, 3]
}
function Child5 () {
Parent5.call(this)
this.type = 'child5'
}
Child5.prototype = Object.create(Parent5.prototype)
Child5.prototype.constructor = Child5
const s7 = new Child5()
const s8 = new Child5()
s7.play.push(4)
console.log(s7, s8)
console.log(s7.constructor)
这种组合方式继承,既能继承父类的属性,又能独立存在