JavaScript 中 Class.method 与 Class.prototype.method 的差别：你真的理解了吗？

javascript

2024-03-19 04:35:29

JavaScript 中 Class.method 与 Class.prototype.method 的细微差别

在 JavaScript 的类系统中，方法声明有两种不同的方式：Class.method 和 Class.prototype.method。虽然看似相似，但这两种方法之间的细微差别对于有效利用类至关重要。

静态方法 vs 实例方法

静态方法 ，声明为 Class.method，独立于类的实例。它们直接通过类名调用，不需要实例化类。

实例方法 ，声明为 Class.prototype.method，与类的实例绑定。它们需要通过类实例才能调用，并且与该实例的属性和方法一起访问。

作用域和 `this`

静态方法存在于类本身，而实例方法存在于类的原型中。原型是一个对象，所有类的实例都从该对象继承属性和方法。

静态方法没有 this 关键字，因为它们没有与实例关联。相反，实例方法有 this 关键字，它指向调用该方法的实例。

何时使用

静态方法： 当需要一个独立于实例的方法时，例如实用函数、构造函数或访问类级别的属性。
实例方法： 当需要一个与实例绑定的方法时，例如访问或修改实例属性，或执行特定于实例的操作。

思考模型

将 Class.method 视为静态方法是合理的，因为它独立于实例。然而，将 Class.prototype.method 视为实例方法并不是完全准确的。更准确地说，它是一个原型方法 ，因为它是附加到原型中的函数。

示例

class Person {
  constructor(name) {
    this.name = name;
  }

  // 静态方法
  static greet() {
    console.log("Hello!");
  }

  // 原型方法
  sayHello() {
    console.log(`Hello, my name is ${this.name}!`);
  }
}

// 调用静态方法
Person.greet(); // 输出：Hello!

// 创建一个实例并调用原型方法
const person = new Person("John");
person.sayHello(); // 输出：Hello, my name is John!