Выражения классов 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() и присвойте его результат переменной приветствия:

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')

Это выражение возвращает экземпляр выражения класса, который присваивается переменной приложения.

Следующее вызывает метод start() для объекта приложения:

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

Заключение

• ES6 предоставляет вам альтернативный способ определения нового класса с помощью выражения класса.
• Выражения класса могут быть именованными или безымянными.
• Выражение класса можно использовать для создания одноэлементного объекта.