JavaScript原型链是对象查找属性的隐式路径,通过__proto__链接到prototype实现继承;class是语法糖,底层仍基于原型链;推荐Object.create实现安全继承。

JavaScript 中的原型链是对象查找属性和方法时遵循的一条隐式连接路径,它让对象可以共享和继承其他对象的特性。每个对象内部都有一个指向其原型对象的链接(通常通过 __proto__ 访问),而原型对象本身也可能有原型,这样层层向上就构成了“原型链”。当访问一个对象的属性时,JavaScript 引擎会先在该对象自身查找;没找到就沿着 __proto__ 去它的原型上找,一直追到 Object.prototype(它的 __proto__ 是 null),链就结束了。
原型链的核心机制
所有函数(包括构造函数)都有一个 prototype 属性,它是一个对象,用于被实例对象的 __proto__ 所指向。当你用 new Fn() 创建实例时,该实例的 __proto__ 会自动指向 Fn.prototype。这个绑定是实现继承的基础。
-
Function.prototype是所有函数的原型,它的__proto__指向Object.prototype -
Object.prototype.__proto__ === null,这是原型链的终点 -
Array、Date等内置构造函数也遵循同样规则,它们的实例原型最终都连到Object.prototype
用原型实现经典继承(构造函数 + prototype)
最基础的方式是把父类的实例方法挂到父构造函数的 prototype 上,再让子构造函数的 prototype 指向父类的一个实例(或更推荐地,用 Object.create(Parent.prototype)),最后修正子类的 constructor 指回自身。
- 定义父构造函数,并在其
prototype上添加方法:function Animal(name) { this.name = name; }
Animal.prototype.speak = function() { console.log(this.name + ' makes a sound'); }; - 定义子构造函数,并建立原型继承:
function Dog(name, breed) { Animal.call(this, name); this.breed = breed; }
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog; - 给子类添加独有方法:
Dog.prototype.bark = function() { console.log(this.name + ' barks!'); };
ES6 class 语法背后的原型继承
class 只是语法糖,底层仍是基于原型链。使用 extends 和 super() 本质上就是在设置原型关系并调用父构造函数。
立即学习“Java免费学习笔记(深入)”;
-
class Dog extends Animal等价于手动设置Dog.prototype.__proto__ === Animal.prototype -
super()在子类构造器中调用父类构造函数,确保this正确初始化 - 子类方法写在
class内部,最终都会被添加到Dog.prototype上
注意事项与常见陷阱
直接赋值 Child.prototype = Parent.prototype 是错误的,会导致修改子类原型影响父类;用 new Parent() 当子类原型可能触发父类副作用(比如执行初始化逻辑)。推荐始终使用 Object.create(Parent.prototype)。
- 避免污染
Object.prototype—— 给它加属性会影响所有对象,极易引发冲突 - 检查属性是否为自有属性,可用
obj.hasOwnProperty('prop')或Object.prototype.hasOwnProperty.call(obj, 'prop') - 现代开发中优先使用
class+extends,语义清晰且不易出错;理解原型链是为了调试和深入掌握 JS 机制











