JS原型链是JavaScript实现继承的核心机制，理解原型对象和原型链的运行规则，能帮助开发者更高效地编写可复用的代码，也能更好地读懂框架和库的底层实现逻辑。
什么是原型对象
每个JavaScript函数在创建时，都会自动生成一个prototype属性，这个属性指向一个对象，就是该函数的原型对象。原型对象默认会有一个constructor属性，指回对应的构造函数。
当我们通过构造函数创建实例时，实例会有一个隐式原型__proto__属性，这个属性指向构造函数的原型对象。
// 定义构造函数
function Person(name) {
this.name = name;
}
// 构造函数的prototype属性指向原型对象
console.log(Person.prototype); // 输出原型对象，包含constructor属性
// 创建实例
const person1 = new Person('张三');
// 实例的__proto__指向构造函数的原型对象
console.log(person1.__proto__ === Person.prototype); // 输出true
原型链的查找规则
当我们访问一个对象的属性时，会先在对象自身的属性中查找，如果找不到，就会沿着__proto__属性向上查找，直到找到对应的属性或者到达null，这个查找的链条就是原型链。
所有对象的原型链最终都会指向Object.prototype，而Object.prototype的__proto__是null，这是原型链的终点。
function Animal(type) {
this.type = type;
}
// 在原型对象上添加方法
Animal.prototype.sayType = function() {
console.log('我是' + this.type);
};
const cat = new Animal('猫');
// 自身没有sayType方法，沿着原型链找到Animal.prototype上的方法
cat.sayType(); // 输出我是猫
// 验证原型链终点
console.log(Object.prototype.__proto__); // 输出null
原型链继承的实现方式
1. 原型链继承（基本方式）
将子类的原型对象指向父类的实例，这样子类实例就能访问父类原型上的属性和方法，实现继承。
// 父类构造函数
function Parent() {
this.parentName = '父类属性';
}
Parent.prototype.parentMethod = function() {
console.log('父类原型方法');
};
// 子类构造函数
function Child() {
this.childName = '子类属性';
}
// 核心：子类原型指向父类实例
Child.prototype = new Parent();
// 修复子类的constructor指向
Child.prototype.constructor = Child;
const child = new Child();
console.log(child.parentName); // 输出父类属性
child.parentMethod(); // 输出父类原型方法
这种方式的缺点是，父类实例的引用类型属性会被所有子类实例共享，修改一个实例的该属性会影响其他实例。
2. 借用构造函数继承
在子类构造函数中调用父类构造函数，通过call或apply改变父类中this的指向，让子类实例拥有父类的实例属性。
function Parent(name) {
this.name = name;
this.hobbies = ['吃饭', '睡觉'];
}
function Child(name) {
// 调用父类构造函数，this指向子类实例
Parent.call(this, name);
}
const child1 = new Child('小明');
const child2 = new Child('小红');
child1.hobbies.push('打球');
console.log(child1.hobbies); // 输出["吃饭", "睡觉", "打球"]
console.log(child2.hobbies); // 输出["吃饭", "睡觉"]，不会被共享影响
这种方式无法继承父类原型对象上的方法，只能继承父类的实例属性。
3. 组合继承（常用方式）
结合原型链继承和借用构造函数继承的优点，既可以让子类实例拥有独立的父类实例属性，又能继承父类原型上的方法。
function Parent(name) {
this.name = name;
this.hobbies = ['读书', '旅行'];
}
Parent.prototype.sayName = function() {
console.log('我的名字是' + this.name);
};
function Child(name, age) {
// 借用构造函数继承实例属性
Parent.call(this, name);
this.age = age;
}
// 原型链继承原型方法
Child.prototype = new Parent();
Child.prototype.constructor = Child;
// 子类自己的原型方法
Child.prototype.sayAge = function() {
console.log('我今年' + this.age + '岁');
};
const child1 = new Child('小刚', 18);
child1.hobbies.push('跑步');
console.log(child1.hobbies); // 输出["读书", "旅行", "跑步"]
child1.sayName(); // 输出我的名字是小刚
child1.sayAge(); // 输出我今年18岁
const child2 = new Child('小美', 20);
console.log(child2.hobbies); // 输出["读书", "旅行"]
child2.sayName(); // 输出我的名字是小美
使用原型链的注意事项
- 不要直接修改实例的
__proto__属性，会影响性能，建议通过修改构造函数的prototype来操作原型。 - 给原型对象添加属性或方法时，要放在修改
constructor指向之后，避免被覆盖。 - 原型链不宜过长，过长的原型链会影响属性查找的性能。
原型链是JavaScript面向对象编程的核心基础，掌握它的使用方法和继承实现逻辑，能帮助你更深入理解JavaScript的语言特性，写出更规范的代码。
JS原型链原型对象原型链继承JavaScript修改时间：2026-06-20 01:06:33