JavaScript 的 class 和箭头函数

在JavaScript中，class 和箭头函数（Arrow functions）是ES6（ECMAScript 2015）引入的两个重要特性，它们分别提供了更简洁和更强大的方式来定义对象和函数。下面是对这两个特性的详细解释：

Class（类）

在ES6之前，JavaScript没有原生的类（class）概念，而是通过构造函数（constructor functions）和原型链（prototype chain）来模拟类的行为。ES6引入了class关键字，使得定义类变得更加直观和简洁。

基本语法

class ClassName {constructor(property1, property2, ...) {// 构造函数，初始化对象的属性this.property1 = property1;this.property2 = property2;...}methodName(param1, param2, ...) {// 类的方法...}// 可以定义getter和setter方法get propertyName() {return this._propertyName;}set propertyName(value) {this._propertyName = value;}// 静态方法使用static关键字static staticMethodName(param1, param2, ...) {...}
}

类的使用

const instance = new ClassName(value1, value2, ...);
instance.methodName(param1, param2, ...);

继承

ES6的类还支持继承，通过extends关键字实现。

class SubClassName extends ClassName {constructor(property1, property2, ...) {super(property1, property2, ...); // 调用父类的构造函数// 可以在这里添加子类特有的属性或逻辑}// 可以重写父类的方法，也可以添加新的方法methodName(param1, param2, ...) {// ...}
}

箭头函数（Arrow functions）

箭头函数提供了一种更简洁的方式来定义函数，并且它们有一些与传统函数不同的行为特性。

基本语法

const functionName = (param1, param2, ...) => {// 函数体return value; // 如果函数体只有一行且需要返回值，可以省略花括号和return关键字
};// 如果没有参数或需要多个参数，可以这样写：
const noParams = () => { ... };
const multipleParams = (a, b) => a + b;

特性

没有自己的this：箭头函数不会创建自己的this上下文，而是继承自它们被定义时的上下文（也称为词法作用域或静态作用域）。这使得箭头函数非常适合用作回调函数，因为它们不会意外地改变this的值。
没有arguments对象：箭头函数没有自己的arguments对象。如果需要访问函数的参数列表，可以使用剩余参数（...rest）语法。
不能用作构造函数：箭头函数不能使用new关键字调用，也不能有[[Construct]]方法，因此它们不能用作构造函数。
没有prototype属性：由于不能用作构造函数，箭头函数也没有prototype属性。
更简洁的语法：对于简单的函数，箭头函数提供了更简洁的语法，尤其是当函数体只有一行时。