JavaScript 原型和原型链：零基础轻松掌握

2023-11-18 22:52:49

JavaScript中的原型

在 JavaScript 中，每个函数都有一个原型对象，它包含了该函数的所有属性和方法。原型对象可以通过函数的 prototype 属性访问。例如，以下代码创建了一个名为 add 的函数，并使用 prototype 属性为其添加了一个名为 subtract 的方法：

function add(a, b) {
  return a + b;
}

add.prototype.subtract = function(a, b) {
  return a - b;
};

现在，我们可以使用 add 函数的 prototype 属性来访问 subtract 方法：

const result = add.prototype.subtract(10, 5);
console.log(result); // 输出：5

原型链

原型链是一种用于查找对象属性的机制。当我们访问一个对象的属性时，JavaScript 会首先在该对象的原型对象中查找该属性。如果找不到，则会继续在该原型对象的原型对象中查找，依此类推。这种查找机制被称为原型链查找。

例如，以下代码创建一个对象 person，并为其添加一个名为 name 的属性：

const person = {
  name: 'John Doe'
};

现在，我们可以使用原型链查找来访问 person 对象的 name 属性：

const name = person.name;
console.log(name); // 输出：John Doe

在上面的示例中，JavaScript 会首先在 person 对象中查找 name 属性。由于在 person 对象中找到了 name 属性，因此不会继续在原型链中查找。

原型和原型链在 JavaScript 中有着广泛的应用，包括：

继承：原型链提供了继承机制，允许我们创建新的对象，这些新对象继承了父对象的所有属性和方法。
面向对象编程：原型链是 JavaScript 实现面向对象编程的基础。通过使用原型链，我们可以创建具有封装性、继承性和多态性的对象。
代码重用：原型链可以帮助我们重用代码。我们可以将公用属性和方法放在原型对象中，然后让其他对象继承这些属性和方法。
提高性能：原型链可以提高代码的性能。当我们访问一个对象的属性时，JavaScript 会首先在该对象的原型对象中查找该属性。如果找到了，则可以直接返回该属性的值，而无需遍历整个对象。