编辑“︁JavaScript原型链继承”︁

{{DISPLAYTITLE:JavaScript原型链继承}}  
{{编程概念导航}}  

== 概述 ==  
'''原型链继承'''是JavaScript中实现对象间继承关系的核心机制。当访问一个对象的属性时，若该对象自身不存在该属性，JavaScript会沿着其原型链（prototype chain）向上查找，直到找到该属性或到达链的末端（`null`）。这种机制使得对象可以共享原型上的属性和方法，从而实现代码复用和继承。

== 原型与原型链基础 ==  
在JavaScript中，每个对象都有一个内部属性`[[Prototype]]`（可通过`__proto__`或`Object.getPrototypeOf()`访问）。构造函数（如`function Person() {}`）的`prototype`属性指向一个原型对象，该对象的`constructor`属性指回构造函数。  

<mermaid>  
graph LR  
    A[实例对象] -->|__proto__| B[构造函数的prototype]  
    B -->|__proto__| C[Object.prototype]  
    C -->|__proto__| D[null]  
</mermaid>  

=== 示例代码 ===  
<syntaxhighlight lang="javascript">  
function Animal(name) {  
    this.name = name;  
}  

Animal.prototype.speak = function() {  
    console.log(`${this.name} makes a noise.`);  
};  

function Dog(name) {  
    Animal.call(this, name); // 调用父类构造函数  
}  

// 设置原型链  
Dog.prototype = Object.create(Animal.prototype);  
Dog.prototype.constructor = Dog;  

const dog = new Dog('Rex');  
dog.speak(); // 输出: "Rex makes a noise."  
</syntaxhighlight>  

**解释**：  
1. `Dog`通过`Object.create(Animal.prototype)`继承`Animal`的原型方法。  
2. `Animal.call(this, name)`确保父类属性被正确初始化。  
3. 最终`dog`实例通过原型链访问到`speak`方法。  

== 原型链的详细机制 ==  
=== 属性查找顺序 ===  
JavaScript按以下顺序查找属性：  
1. 对象自身属性。  
2. 对象的`[[Prototype]]`（即`__proto__`）。  
3. 递归步骤2，直到找到属性或`[[Prototype]]`为`null`。  

=== 原型链的终点 ===  
所有原型链最终指向`Object.prototype`，其`__proto__`为`null`。  

== 实际应用场景 ==  
=== 共享方法节省内存 ===  
通过将方法定义在原型上，所有实例共享同一方法，减少内存占用：  
<syntaxhighlight lang="javascript">  
function User(name) { this.name = name; }  
User.prototype.greet = function() { console.log(`Hello, ${this.name}!`); };  

const user1 = new User('Alice');  
const user2 = new User('Bob');  
// user1和user2共享greet方法  
</syntaxhighlight>  

=== 扩展内置对象 ===  
通过修改原型链扩展内置对象功能（需谨慎使用）：  
<syntaxhighlight lang="javascript">  
Array.prototype.last = function() { return this[this.length - 1]; };  
console.log([1, 2, 3].last()); // 输出: 3  
</syntaxhighlight>  

== 注意事项 ==  
1. **性能问题**：过长的原型链会增加查找时间。  
2. **意外覆盖**：修改原型会影响所有实例。  
3. **构造函数重置**：继承时必须修正`constructor`属性（如`Dog.prototype.constructor = Dog`）。  

== 进阶：组合继承与原型链 ==  
组合使用构造函数和原型链可解决引用类型共享问题：  
<syntaxhighlight lang="javascript">  
function Parent() { this.colors = ['red', 'blue']; }  
function Child() { Parent.call(this); } // 继承属性  
Child.prototype = Object.create(Parent.prototype); // 继承方法  

const child1 = new Child();  
child1.colors.push('green');  
console.log(new Child().colors); // 输出: ["red", "blue"]（不共享colors）  
</syntaxhighlight>  

== 总结 ==  
原型链继承是JavaScript面向对象编程的基石，理解其机制有助于编写高效、可维护的代码。通过合理利用原型共享和构造函数初始化，可以实现灵活的继承模式。  

{{JavaScript学习路径结构}}

[[Category:编程语言]]
[[Category:JavaScript]]
[[Category:Javascript面向对象编程]]