5

JavaScript Class 类表达式

 1 year ago
source link: https://www.myfreax.com/javascript-class-lei-biao-da-shi/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
JavaScript Class 类表达式

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 淘宝打赏

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK