ES6 中的 class
在 ES6(ECMAScript 2015)中,class
关键字引入了一种新的方式来创建和继承对象。这种语法更接近传统的面向对象编程语言,如 Java 和 C++,从而使得对象模型更易理解和使用。
基础语法
下面是一个简单的 class
定义:
javascript
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name}`);
}
}
const john = new Person('John', 30);
john.sayHello(); // 输出 "Hello, my name is John"
构造函数 constructor
constructor
是一个特殊的方法,用于创建和初始化由 class
创建的对象。一个类只能拥有一个名为 "constructor" 的特殊方法。
实例方法和属性
在 constructor
方法中定义的属性和方法是实例属性和方法,每个实例对象都有自己的一份。
静态方法和属性
使用 static
关键字,你可以定义一个类的静态方法。静态方法不会出现在类的实例上,而是直接出现在类本身上。
javascript
class MathHelper {
static square(x) {
return x * x;
}
}
console.log(MathHelper.square(5)); // 输出 25
继承(Inheritance)
使用 extends
关键字创建一个类作为另一个类的子类。
javascript
class Student extends Person {
constructor(name, age, grade) {
super(name, age); // 调用父类的 constructor
this.grade = grade;
}
sayGrade() {
console.log(`I am in grade ${this.grade}`);
}
}
const jane = new Student('Jane', 20, 'Grade 1');
jane.sayHello(); // 输出 "Hello, my name is Jane"
jane.sayGrade(); // 输出 "I am in grade Grade 1"
访问器(Getters 和 Setters)
你可以使用 get
和 set
关键字来创建对象属性的访问器。
javascript
class Circle {
constructor(radius) {
this._radius = radius;
}
get radius() {
return this._radius;
}
set radius(value) {
if (value <= 0) {
console.log('Invalid radius');
} else {
this._radius = value;
}
}
}
const circle = new Circle(5);
console.log(circle.radius); // 输出 5
circle.radius = -1; // 输出 "Invalid radius"
私有属性和方法(提案)
目前,JavaScript 还没有提供原生的方式来定义私有属性和方法,但有一个字段声明的提案,使用 #
符号来声明私有属性。
javascript
class Counter {
#count = 0;
increment() {
this.#count++;
}
getCount() {
return this.#count;
}
}
这些是 ES6 中 class
的主要特性和用法。这些新特性提供了一种更结构化、更面向对象的方式来组织代码,使得 JavaScript 变得更加灵活和强大。希望这些信息能帮助你更好地理解和使用 ES6 中的 class
特性。