继承(精炼提点)

最新推荐文章于 2024-08-16 19:02:09 发布

金凯枫

最新推荐文章于 2024-08-16 19:02:09 发布

阅读量49

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_73596760/article/details/128679231

版权

本文介绍了JavaScript中的几种继承方式，包括借用构造函数继承（通过`call`或`apply`实现属性继承）、原型继承（用于继承父类原型上的方法）、组合继承（结合构造函数和原型继承），以及ES6的`extends`关键字实现的类继承，强调了在继承过程中需要注意的点，如`super`的使用和避免原型链污染。

摘要由CSDN通过智能技术生成

1.借用构造函数继承

function Person(name,age) {
this.name = name
this.age = age
}

function Star(name,age,money) {
/*this.name = name
  this.age = age */
这种直接加进来继承是不行的,等于把上面搬下来了
**借用/盗用构造函数继承**
// call, apply 都可以
Person.call(this,name,age)
//Person.apply(this,[name,age])
this.money = money
}

const res = new Star('胡歌',18,10000)
console.log(res)

注意:借用构造函数只能继承父类属性,不能继承父类的方法

2.原型继承(继承的是父类构造函数原型上的方法)

承接上面......

//Star.prototype = Person.prototype 其实是等价的,因为指向的是同一地址
//下面这样是可以,但是有问题  **相互影响**
Star.prototype = Person.prototype
Star.prototype.sing = function() {
console.log('sing')
}

//解决办法  
Star.prototype = new Person()
Star.prototype.constructor = star

/*new 一个实例出来接收,但是最后一定要把原型指回去*/

const res = new Star('胡歌',18,100000)

注意: new一个实例出来接收,最后一定要把new出来的原型指向本身,这样就可以继承方法

3.组合继承

组合继承 = 借用构造函数继承（继承的是属性） + 原型继承（继承的是父类原型上的方法）

4.ES6 使用 extends 去继承

calss Star extends Person{
constructor(name,age,money) {
// 相当于这儿调用了父类的 constructor 的同时,并把父类constructor 内部的this改成了这儿的this
 super(name,age)
 this.money = money
 }
}
// 注意:!在 ES6 继承的时候，如果子类有 constructor，必须调用 super，而且 super 要在 this 上面调用

注意点:在 ES6 继承的时候，如果子类有 constructor，必须调用 super，而且 super 要在 this 上面调用