JavaScript 类继承与原型继承的区别

最新推荐文章于 2024-08-29 16:49:31 发布

K'illCode

最新推荐文章于 2024-08-29 16:49:31 发布

阅读量1.1k

点赞数 2

分类专栏：前端文章标签： js

本文链接：https://blog.csdn.net/dome_/article/details/103948523

版权

在ES6之前，JavaScript的继承主要通过构造函数和原型链实现，各有缺点。构造函数继承利用apply或call改变this指向，不涉及原型链。原型链继承通过原型对象实现，但多个实例间存在相互影响。ES6引入类的概念，类继承更直观，与原型继承的区别在于[[Prototype]]链接、this创建顺序和super的使用。

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

在 ES6 之前，JavaScript 实现两个对象的继承一般有两种方法。

一种方法是利用 this 与构造函数。

function Parent(name,height) {
    this.name = name;
    this.height = height;
}

function Child(age) {
    Parent.apply(this,['hahaha',171])
    this.age = age;
}

let ch = new Child(21);

console.log(ch.name)

在这种方法中，利用 apply 或 call，在一个函数中改变了另一个函数的 this 指向并运行。结果是一个构造函数的实例，继承了另一个构造函数的属性和方法。这种方法有一个缺点，对于原型链上的继承没有实现。

另一种方法是利用原型链实现属性的继承。

function Parent(name,height) {
    this.name = name;
    this.height = height;
}

function Child(age) {
    this.age = age;
}

Child.prototype = new Parent('hahaha',171);

let ch = new Child(21)

console.log(ch.name)

这种方法与其说是继承，不如说是一种查找规则。JavaScript 中如果在一个对象中找不到相关属性和方法，就会沿着原型链向上查找。

在这段代码中，将 Child 的原型对象设置为 Parent 的一个实例