JavaScript 构造函数及原型链：内存管理与方法分配

2023-10-11 14:23:07

构造函数及其问题
构造函数是一种用于创建新对象的函数，通过使用 new 操作符，可以创建一个新对象的实例。构造函数中的方法和属性可以通过点运算符访问。

function Person(name) {
  this.name = name;
  this.greet = function() {
    console.log(`Hello, my name is ${this.name}.`);
  };
}

const person1 = new Person('Alice');
person1.greet(); // 输出: Hello, my name is Alice.

这种方法存在一个问题，即每个实例都包含自己的方法副本。例如，上面的 greet 方法在每个 Person 实例中都会被创建一份副本。这会导致内存浪费，特别是当实例数量很大时。

原型分配方法

为了解决构造函数方法分配的问题，JavaScript 引入了原型分配的方法。原型是一个对象，包含了所有实例共有的属性和方法。当创建新实例时，JavaScript 会在原型中查找方法和属性，而不是在实例本身中。

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

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

const person1 = new Person('Alice');
person1.greet(); // 输出: Hello, my name is Alice.

在上面的例子中，greet 方法被分配到了 Person.prototype 中，而不是直接分配给每个实例。这样，所有 Person 实例都可以访问这个方法，而无需在每个实例中创建一份副本。

原型链

原型链是 JavaScript 中的一个重要概念。每个对象都有一个内部的 __proto__ 属性，指向它的原型对象。如果一个对象找不到某个属性或方法，JavaScript 会沿着原型链向上查找，直到找到该属性或方法，或者到达原型链的末端。

const person1 = new Person('Alice');
console.log(person1.__proto__); // 输出: Person {}

const person2 = new Person('Bob');
console.log(person2.__proto__); // 输出: Person {}

在上面的例子中，person1 和 person2 的 __proto__ 属性都指向 Person.prototype。这意味着它们都可以访问 Person.prototype 中定义的方法和属性，例如 greet 方法。

充分利用原型链

我们可以充分利用原型链来实现面向对象编程。我们可以创建一个基类，定义一些共有的属性和方法，然后创建子类，继承基类的属性和方法，并添加新的属性和方法。

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

Animal.prototype.eat = function() {
  console.log(`${this.name} is eating.`);
};

function Dog(name) {
  Animal.call(this, name);
}

Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.bark = function() {
  console.log(`${this.name} is barking.`);
};

const dog1 = new Dog('Buddy');
dog1.eat(); // 输出: Buddy is eating.
dog1.bark(); // 输出: Buddy is barking.