揭秘原型链的玄妙：深入剖析Tom和People之间的隐秘联系

原型链的运作方式

原型链是JavaScript中的一种继承机制，它允许对象访问和继承其他对象的属性和方法。每个对象都拥有一个原型对象，而原型对象又拥有自己的原型对象，如此递归下去，直到最终到达null。

当我们访问一个对象的属性或方法时，JavaScript引擎会首先在该对象中查找。如果找不到，则会沿着原型链向上查找，直到找到该属性或方法。如果在原型链中也没有找到，则会返回undefined。

Tom和People之间的关系

为了更好地理解原型链的查找过程，我们以Tom和People之间的关系为例。

function People(name) {
  this.name = name;
}

People.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}`);
};

const tom = new People('Tom');

在上面的代码中，我们定义了一个People函数，它接受一个name参数，并将其存储在this.name属性中。我们还定义了一个sayHello方法，它打印出对象的名称。

接下来，我们使用new People('Tom')创建了一个名为tom的People对象。tom对象拥有自己的属性和方法，但它也可以访问People.prototype的属性和方法。这是因为tom对象的原型对象是People.prototype。

如果我们调用tom.sayHello()方法，则JavaScript引擎会首先在tom对象中查找sayHello方法。如果没有找到，则会沿着原型链向上查找，直到找到People.prototype.sayHello方法。然后，JavaScript引擎会执行该方法，并将tom.name作为参数传递给它。

问题一：如果在tom对象中修改了name属性，会发生什么？

如果我们修改了tom对象的name属性，则不会影响People.prototype.name属性。这是因为对象属性是独立的，不会影响原型对象中的属性。

tom.name = 'Jerry';

console.log(tom.name); // Jerry
console.log(People.prototype.name); // undefined

在上面的代码中，我们修改了tom对象的name属性。然后，我们打印出tom.name和People.prototype.name。结果显示，tom.name的值为"Jerry"，而People.prototype.name的值为undefined。

这是因为tom对象的name属性是独立于People.prototype.name属性的。当我们修改tom.name属性时，不会影响People.prototype.name属性。

问题二：如果在People.prototype对象中修改了sayHello方法，会发生什么？

如果我们修改了People.prototype对象的sayHello方法，则会影响所有People对象。这是因为原型对象的方法是共享的，所有People对象都会访问同一个sayHello方法。

People.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}!`);
};

tom.sayHello(); // Hello, my name is Jerry!

在上面的代码中，我们修改了People.prototype.sayHello方法。然后，我们调用tom.sayHello()方法。结果显示，控制台输出"Hello, my name is Jerry!"。

这是因为tom对象会沿着原型链找到People.prototype.sayHello方法，并执行该方法。由于我们修改了People.prototype.sayHello方法，因此tom对象也会受到影响。

总结

原型链是JavaScript中一种重要的继承机制，它允许对象访问和继承其他对象的属性和方法。通过理解原型链的查找过程，您可以更好地掌握JavaScript的精髓，并编写出更加高效和优雅的代码。