JavaScript Class 类表达式

在本教程中，您将学习如何使用 JavaScript 类表达式声明类。

JavaScript 类表达式简介

与函数类似，类也有表达形式。类表达式为您提供了另一种定义类的方法。类表达式不需要在关键字 class 后加上标识符。

您可以在变量声明中使用类表达式并将其作为参数传递给函数。例如，下面定义一个类表达式：

let Person = class {
    constructor(name) {
        this.name = name;
    }
    getName() {
        return this.name;
    }
}

表达式的左侧是变量 Person。它被分配给一个类表达式。类表达式以关键字 class 开头，后跟类定义。

类表达式可能有名称，也可能没有。在这个例子中，我们有一个未命名的类表达式。如果类表达式有名称，其名称可以是类主体的局部名称。

下面创建类表达式 Person 的一个实例。它的语法与类声明一样。

let person = new Person('John Doe');

与类声明一样，类表达式的类型也是一个函数：

console.log(typeof Person); // function

与函数表达式类似，类表达式没有提升。这意味着您不能在定义类表达式之前创建类的实例。

一等公民

JavaScript 类是一等公民。这意味着您可以将类传递给函数，从函数返回它，并将其分配给变量。

例如以下示例：

function factory(aClass) {
    return new aClass();
}

let greeting = factory(class {
    sayHi() { console.log('Hi'); }
});

greeting.sayHi(); // 'Hi'

首先，定义 factory() 函数将类表达式作为参数并返回类实例：

function factory(aClass) {
    return new aClass();
}

其次，将未命名的类表达式传递给 factory() 函数并将其结果分配给 greeting 变量：

let greeting = factory(class {
    sayHi() { console.log('Hi'); }
});

类表达式有一个 sayHi() 的方法。变量 greeting 是类表达式的实例。

最后，调用对象的 sayHi() 方法：

greeting.sayHi(); // 'Hi'

单例

单例是将类的实例化单个实例的设计模式。它确保在整个系统中只能创建一个类的实例。类表达式可用于创建单例，通过立即调用类构造函数来创建实例。

为此，您将 new 运算符与类表达式一起使用，并在类声明的末尾包含括号，如以下示例所示：

let app = new class {
    constructor(name) {
        this.name = name;
    }
    start() {
        console.log(`Starting the ${this.name}...`);
    }
}('Awesome App');

app.start(); // Starting the Awesome App...

看看代码是如何运行。

以下是一个未命名的类表达式：

new class {
    constructor(name) {
        this.name = name;
    }
    start() {
        console.log(`Starting the ${this.name}...`);
    }
}

该类有一个构造函数 constructor() 接受一个参数。它还有一个名为 start() 方法。

类表达式评估为一个类。因此，您可以通过在表达式后放置括号来立即调用其构造函数：

new class {
    constructor(name) {
        this.name = name;
    }
    start() {
        console.log(`Starting the ${this.name}...`);
    }
}('Awesome App')

此表达式返回类表达式的实例分配给 app 变量的。以下语句调用 app 对象 start() 的方法：

app.start(); // Starting the Awesome App...

结论

• ES6 为您提供了另一种使用类表达式定义类的方法。
• 类表达式可以命名或未命名。
• 类表达式可用于创建单例对象。

myfreax

微信公众号

支付宝打赏