返回

ES6 class 类,基础性语法糖结构

前端

ES6 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.`);
  }
}

构造函数

类中的构造函数用于初始化类的实例。构造函数中的参数将被传递给类的实例。

类变量

类变量是属于类的变量。类变量可以通过 static 来定义。类变量可以在类的任何地方使用,包括类的实例中。

属性访问器

属性访问器允许我们定义自定义的 getter 和 setter 方法来访问和修改类的属性。

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

  get age() {
    return this._age;
  }

  set age(value) {
    if (value < 0) {
      throw new Error("Age cannot be negative.");
    }
    this._age = value;
  }
}

静态方法

静态方法是属于类的函数。静态方法可以通过 static 关键字来定义。静态方法不能访问类的实例,只能访问类的变量和方法。

class Person {
  static greet() {
    console.log("Hello, world!");
  }
}

Person.greet(); // Hello, world!

继承

ES6 class 支持继承。子类可以继承父类的属性和方法。

class Student extends Person {
  constructor(name, age, major) {
    super(name, age);
    this.major = major;
  }

  study() {
    console.log(`${this.name} is studying ${this.major}.`);
  }
}

重写

子类可以重写父类的方法。重写的方法必须与父类的方法具有相同的方法名和参数列表。

class Student extends Person {
  greet() {
    super.greet();
    console.log("I am a student.");
  }
}

总结

ES6 class 是 JavaScript 中一种基础性的语法糖结构。它使用类来封装数据和行为。类可以定义属性和方法,并且可以继承其他类。ES6 class 可以用于编写更具组织性和可维护性的代码。