类是语法糖,底层仍基于原型继承。使用class更简洁安全,extends自动处理原型链,super调用父类;而构造函数需手动管理prototype和constructor,易出错但更贴近底层机制。

在JavaScript中,实现对象创建和继承的方式有多种,其中“类”与“构造函数 + 原型继承”是两种常见模式。虽然ES6引入了class语法让JavaScript看起来更像传统面向对象语言,但其底层机制依然基于原型继承。理解两者差异有助于写出更清晰、高效的代码。
类(Class)的本质是语法糖
ES6中的class并不是一个全新的继承模型,而是对原有构造函数和原型链的语法封装。
例如,下面这个类:
class Person {constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello, I'm ${this.name}`);
}
}
等价于以下构造函数写法:
立即学习“Java免费学习笔记(深入)”;
function Person(name) {this.name = name;
}
Person.prototype.greet = function() {
console.log(`Hello, I'm ${this.name}`);
};
结论:类只是让原型继承的写法更清晰、更接近其他语言的开发习惯,但底层仍是原型机制。
构造函数与原型继承的手动管理
使用构造函数时,开发者需要显式操作prototype属性来共享方法,也需要手动处理继承关系。
比如实现子类Student继承Person:
Person.call(this, name); // 继承属性
this.grade = grade;
}
// 建立原型链
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
Student.prototype.study = function() {
console.log(`${this.name} is studying.`);
};
这种方式灵活,但容易出错,比如忘记重设constructor或未正确设置原型链。
类的继承更简洁安全
使用class和extends,继承变得直观且不易出错:
constructor(name, grade) {
super(name);
this.grade = grade;
}
study() {
console.log(`${this.name} is studying.`);
}
}
优势:自动处理原型链连接,super()调用父类构造函数,语法清晰,减少人为错误。
原型链的工作机制没有改变
无论使用类还是构造函数,JavaScript的继承本质都是通过原型链实现的。
当调用student.greet()时,引擎会:
- 先在
student实例上查找greet - 找不到则沿着
__proto__去Student.prototype找 - 仍找不到继续到
Person.prototype找到并执行
这种动态查找机制在两种写法中完全一致。
基本上就这些。类让代码更易读,构造函数让你更贴近底层。选哪种,取决于项目需求和团队习惯。










