JS 类 - JavaScript

JavaScript (JS) 是一种高级编程语言，用于在网页和其他应用程序中添加交互功能。JS 类通过面向对象编程 (OOP) 的方式创建对象，并为我们提供了一种编写可维护的、可重用的代码的途径。在本文中，我们将学习 JS 类的各个方面。

创建 JS 类

在 JS 中，可以使用 class 关键字来创建类，如下所示：

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

const person1 = new Person("John", 30);
person1.greet(); // 输出 "Hello, my name is John and I am 30 years old."

上面的代码创建了一个名为 Person 的类，其中包含一个构造函数和一个 greet() 方法。构造函数接收 name 和 age 参数，并将它们分配给 this 对象上的属性。greet() 方法使用这些属性来打印一条问候语。

我们可以使用 new 关键字来实例化一个 Person 对象，并调用其中的 greet() 方法。

继承

JS 中的类可以通过 extends 关键字来继承另一个类的属性和方法。如下所示：

class Student extends Person {
  constructor(name, age, studentId) {
    super(name, age);
    this.studentId = studentId;
  }
  study() {
    console.log(`${this.name} with ID ${this.studentId} is studying.`);
  }
}

const student1 = new Student("Alice", 20, 123456);
student1.greet(); // 输出 "Hello, my name is Alice and I am 20 years old."
student1.study(); // 输出 "Alice with ID 123456 is studying."

上面的代码创建了一个名为 Student 的类，该类继承自 Person 类。Student 类具有单独的 studentId 属性和一个新的 study() 方法。构造函数通过调用 super() 方法来调用父类 Person 的构造函数并传递 name 和 age 参数。

我们可以使用 new 关键字来实例化一个 Student 对象，并调用父类 Person 的方法和 Student 类自己的方法。

访问器

JS 类提供了一种访问器 (getter/setter) 的方法，以保护属性的访问。getter 用于获取属性值，而 setter 用于设置属性值。如下所示：

class Car {
  constructor(make, model, year) {
    this.make = make;
    this.model = model;
    this.year = year;
  }
  get info() {
    return `${this.make} ${this.model} (${this.year})`;
  }
  set yearOfManufacture(year) {
    if (year < 1900) {
      throw new Error("Year of manufacture must be greater than 1900.");
    }
    this.year = year;
  }
}

const car1 = new Car("Tesla", "Model S", 2019);
console.log(car1.info); // 输出 "Tesla Model S (2019)"
car1.yearOfManufacture = 2000;
console.log(car1.info); // 输出 "Tesla Model S (2000)"
car1.yearOfManufacture = 1800; // 抛出 "Year of manufacture must be greater than 1900." 的错误
console.log(car1.info); // 输出 "Tesla Model S (2000)"

上面的代码创建了一个名为 Car 的类，该类包含一个名为 info 的 getter 和一个名为 yearOfManufacture 的 setter。info 返回车辆的基本信息字符串，而 yearOfManufacture setter 会检查传入的值是否小于 1900，如果小于则抛出一个错误。

我们可以通过访问器获取或设置 Car 对象的属性，并调用其中的方法。

静态方法和属性

JS 类提供了一个特殊的 static 关键字，用于创建静态方法和属性。静态方法和属性不能由类的实例来调用，而是直接在类上调用。如下所示：

class MathUtils {
  static add(a, b) {
    return a + b;
  }
  static get PI() {
    return 3.14159;
  }
}

console.log(MathUtils.add(1, 2)); // 输出 3
console.log(MathUtils.PI); // 输出 3.14159

上面的代码创建了一个名为 MathUtils 的类，该类包含一个静态方法 add() 和一个静态属性 PI。我们无法通过 MathUtils 的实例来访问这些方法和属性。

总结

以上是 JS 类的各个方面介绍。我们学习了如何创建类、如何继承类、如何使用访问器来保护属性、如何使用静态方法和属性等。这些都是编写可维护、可重用的程序的关键技能。