理解 JavaScript 原型继承的一个示例

2024/8/1

示例代码如下

function father() {
  this.num = 935;
  this.work = ['read', 'write', 'listen'];
}
function son() {}
son.prototype = new father();
let son1 = new son();
let son2 = new son();
son1.num = 117;
son1.work.pop();
console.log(son2.num);
console.log(son2.work);

• 定义一个father的构造函数：

function father() {
  this.num = 935;
  this.work = ['read', 'write', 'listen'];
}

这个构造函数定义了两个属性：num 和 work

• 定义 一个son 构造函数：

function son() {}

• 设置继承关系：

son.prototype = new father();

创建了一个新的 father 对象，并将其赋值给 son 的原型。这样，所有 son 的实例将继承 father 的属性

• 创建 son 的实例：

let son1 = new son();
let son2 = new son();

分别创建了两个 son 的实例：son1 和 son2，他们的初始值相同

• 修改 son1 的属性：

 son1.num = 117;
son1.work.pop();

son1 的 num 属性被修改为 117，并且从 work 数组中移除了最后一个元素

• 输出 son2 的属性

console.log(son2.num);
console.log(son2.work);

son2.num:
由于 num 是一个基本类型的值，并且在 son2 上没有被修改，它将保留从 father 原型继承来的值，即 935。

son2.work:
由于 work 是一个数组（引用类型），son1 和 son2 共享同一个 work 数组，因为它们都引用了原型上的同一个数组。当 son1.work.pop() 被调用时，它修改了共享的数组，移除了最后一个元素（‘listen’）。

故最后输出
935
[‘read’, ‘write’]