JavaScript 中的 类（class） 是 ES6 引入的语法，它为面向对象编程（OOP）提供了一种更加清晰和结构化的方式。类在 JavaScript 中实际上是基于原型的，它提供了一种更简洁的方式来定义对象的构造函数和方法。通过类，JavaScript 可以更好地实现封装、继承和多态等面向对象的特性。

1. 类的基本语法

类的定义

JavaScript 中定义类使用 class 关键字，类的定义包括构造函数（constructor）和方法。类的实例可以通过 new 关键字来创建。

class ClassName {
    constructor() {
        // 构造函数，用于初始化对象
    }

    methodName() {
        // 实例方法
    }
}

2. 构造函数（constructor）

构造函数是类的一部分，它会在实例化类时自动调用，用于初始化类的实例属性。

语法：

constructor() {
    // 初始化类的实例属性
}

示例：

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("Alice", 25);
person1.greet();  // 输出: Hello, my name is Alice and I am 25 years old.

3. 类的方法

类的方法可以定义在类内部，通常通过 this 访问实例属性。类方法可以有多个，可以在实例化对象后调用。

示例：

class Car {
    constructor(brand, model) {
        this.brand = brand;
        this.model = model;
    }

    displayInfo() {
        console.log(`This car is a ${this.brand} ${this.model}.`);
    }
}

const myCar = new Car("Toyota", "Corolla");
myCar.displayInfo();  // 输出: This car is a Toyota Corolla.

4. 静态方法（static）

静态方法是定义在类本身上的方法，而不是类的实例。静态方法通过类名直接调用，而不需要实例化类。

语法：

static methodName() {
    // 静态方法
}

示例：

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

console.log(MathUtils.add(2, 3));  // 输出: 5

5. 继承（extends）

JavaScript 类支持继承，可以通过 extends 关键字创建子类。子类继承父类的属性和方法，可以重写（覆盖）父类的方法，也可以调用父类的方法。

语法：

class ChildClass extends ParentClass {
    constructor() {
        super();  // 调用父类的构造函数
    }
}

示例：

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

    speak() {
        console.log(`${this.name} makes a noise.`);
    }
}

class Dog extends Animal {
    constructor(name, breed) {
        super(name);  // 调用父类的构造函数
        this.breed = breed;
    }

    speak() {
        console.log(`${this.name} barks.`);
    }
}

const dog = new Dog("Buddy", "Golden Retriever");
dog.speak();  // 输出: Buddy barks.

在上面的例子中，Dog 类继承了 Animal 类，并覆盖了 speak 方法，使得 Dog 类实例调用 speak() 方法时输出不同的内容。

6. super 关键字

super 关键字用于访问和调用父类的构造函数或方法。在子类的构造函数中，必须先调用 super() 才能使用 this，否则会报错。

示例：

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

    greet() {
        console.log(`Hello, ${this.name}!`);
    }
}

class Child extends Parent {
    constructor(name, age) {
        super(name);  // 调用父类的构造函数
        this.age = age;
    }

    greet() {
        super.greet();  // 调用父类的 greet 方法
        console.log(`I am ${this.age} years old.`);
    }
}

const child = new Child("Alice", 10);
child.greet();
// 输出:
// Hello, Alice!
// I am 10 years old.

7. 实例和类方法

类的方法需要通过类的实例来调用。实例方法通常使用 this 关键字访问当前对象的属性和其他方法。

示例：

class Rectangle {
    constructor(length, width) {
        this.length = length;
        this.width = width;
    }

    area() {
        return this.length * this.width;
    }

    perimeter() {
        return 2 * (this.length + this.width);
    }
}

const myRectangle = new Rectangle(10, 5);
console.log(myRectangle.area());  // 输出: 50
console.log(myRectangle.perimeter());  // 输出: 30

8. getter 和 setter

JavaScript 中的类支持定义 getter 和 setter 方法来访问和修改对象的属性。getter 用于获取属性的值，setter 用于设置属性的值。

语法：

get propertyName() {
    return this._propertyName;
}

set propertyName(value) {
    this._propertyName = value;
}

示例：

class Person {
    constructor(name, age) {
        this._name = name;
        this._age = age;
    }

    get name() {
        return this._name;
    }

    set name(newName) {
        this._name = newName;
    }

    get age() {
        return this._age;
    }

    set age(newAge) {
        if (newAge > 0) {
            this._age = newAge;
        } else {
            console.log("Age must be positive.");
        }
    }
}

const person1 = new Person("Alice", 25);
console.log(person1.name);  // 输出: Alice
person1.name = "Bob";
console.log(person1.name);  // 输出: Bob

person1.age = -5;  // 输出: Age must be positive.
console.log(person1.age);  // 输出: 25

9. 总结

• 类的定义：使用 class 关键字定义类，类包含构造函数、实例方法、静态方法等。
• 构造函数：通过 constructor 初始化对象属性。
• 继承：通过 extends 和 super 实现类的继承和父类方法的调用。
• 静态方法：静态方法是类的方法，而不是实例的方法，使用 static 关键字声明。
• getter 和 setter：可以使用 get 和 set 方法来访问和修改属性值。

JavaScript 中的类提供了一种更现代、简洁的方式来进行面向对象编程，使得代码更加易于理解和维护。更多详细内容请关注其他相关文章。