JavaScript原型链的使用

在JavaScript中，原型链是理解对象继承机制的关键。在实际开发中，原型链的使用可以帮助我们创建可复用的对象和方法，减少代码冗余，并提高代码的可维护性。以下是一些实际使用原型链的示例和场景：

1. 继承属性和方法

通过原型链，我们可以实现对象的继承。子类可以继承父类的属性和方法，而不必重新定义它们。

function Parent() {
   
  this.name = 'Parent';
}

Parent.prototype.sayHello = function() {
   
  console.log('Hello from Parent!');
};

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

// 关键步骤：设置Child的原型为Parent的一个实例
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

const child = new Child();

console.log(child.name); // 输出：Parent
child.sayHello(); // 输出：Hello from Parent!
console.log(child.age); // 输出：5

在上面的例子中，Child继承了Parent的name属性和sayHello方法。

2. 扩展内置对象

虽然不推荐直接修改内置对象（如Array、String等）的原型，但在某些情况下，为了添加全局功能，可能需要这样做。请注意，这样做可能会导致与其他代码的冲突。

// 示例：为Array添加一个新方法
Array.prototype.myMethod = function() {
   
  // 实现自定义逻辑
};

const arr = [1, 2, 3];
arr.myMethod(); // 调用自定义方法

3. 构造函数与原型链

构造函数用于初始化新创建的对象，而原型链则用于实现方法和属性的共享。

function MyObject() {
   
  this.uniqueProperty = 'unique';
}

MyObject.prototype.sharedMethod = function() {
   
  console.log('This is a shared method.');
};

const obj1 = new MyObject();
const obj2 = new MyObject();

obj1.sharedMethod(); // 输出：This is a shared method.
obj2.sharedMethod(); // 输出：This is a shared method.

console.log(obj1.uniqueProperty); // 输出：unique
console.log(obj2.uniqueProperty); // 输出：unique

在这个例子中，每个MyObject的实例都有它自己的uniqueProperty属性，但它们共享同一个sharedMethod方法。

4. 原型链的查找机制

当访问一个对象的属性或方法时，JavaScript会首先查找对象自身的属性，如果找不到，则会在原型链上继续查找，直到找到为止或到达Object.prototype的尽头。

const obj = {
   };
obj.__proto__ = {
   
  foo: 'bar'
};

console.log(obj.foo); // 输出：bar

在上面的例子中，obj自身没有foo属性，但在其原型链上找到了foo属性。

注意事项

• 避免直接修改Object.prototype，因为这会影响所有的对象。
• 使用Object.create()方法或构造函数来设置原型链，而不是直接赋值__proto__属性。
• 理解constructor属性在原型链中的作用，并在修改原型时确保正确地设置它。
• 谨慎使用原型继承，以避免出现意外的副作用和难以追踪的bug。