原型和继承：JavaScript 开发的基础

2023-12-31 06:13:46

引言

在 JavaScript 中，原型和继承是面向对象编程 (OOP) 的基石。了解这些概念至关重要，因为它使我们能够创建复杂且可维护的应用程序。本文将深入探讨原型和继承在 JavaScript 中的工作原理，并提供如何有效使用它们的实用示例。

原型

每个 JavaScript 对象都具有一个名为 __proto__ 的隐藏属性，它指向该对象的原型对象。原型对象包含对象的公共属性和方法。当我们访问对象的属性或方法时，JavaScript 会首先在该对象本身中查找该属性或方法。如果找不到，它会沿着原型链向上搜索，直到找到该属性或方法为止。

例如：

const person = {
  name: 'John',
  age: 30
};

console.log(person.__proto__);
// {constructor: function, __defineGetter__: function, ...}

console.log(person.__proto__.__proto__);
// {constructor: function, __defineGetter__: function, ...}

console.log(person.__proto__.__proto__.__proto__);
// null

在这个示例中，person 对象的原型链包括 person 对象本身、Object.prototype 和 null。

继承

继承允许我们创建新对象，这些对象继承自现有对象的属性和方法。在 JavaScript 中，继承可以通过两种主要方式实现：原型继承和构造函数继承。

原型继承

原型继承通过修改对象的 __proto__ 属性来实现。例如：

const animal = {
  move() {
    console.log('Animal is moving');
  }
};

const dog = Object.create(animal);

dog.move(); // Animal is moving

在此示例中，dog 对象的 __proto__ 属性被设置为 animal 对象，这意味着 dog 对象继承了 animal 对象的 move() 方法。

构造函数继承

构造函数继承通过使用 new 调用函数来创建新对象。该函数被称为构造函数，它负责初始化新对象的属性和方法。例如：

function Animal() {
  this.move = function() {
    console.log('Animal is moving');
  };
}

function Dog() {
  Animal.call(this);
  this.bark = function() {
    console.log('Dog is barking');
  };
}

const dog = new Dog();

dog.move(); // Animal is moving
dog.bark(); // Dog is barking