Как динамически создать класс

Быстрый старт с выражениями классов

В этой статье рассматривается, как создать класс динамическим способом с использованием выражений класса. Это может быть удобно при создании простых классов, используемых для построения объектов для передачи данных.

Рассмотрим, например, следующий класс Todo.

class Todo{
  constructor(title, completed){
    this.title = title;
    this.completed = completed;
  }
}

Когда у нас есть класс Todo, мы можем использовать его для создания объектов todo, подобных следующему.

const todo = new Todo("Learn", false);
//Todo {title: "Learn", completed: false}

Конструктор функций

Помните, что до создания классов объекты также можно создавать с помощью конструкторов функций. Предыдущий класс Todo может выглядеть так при реализации с использованием конструктора функции.

function Todo(title, completed){
  this.title = title;
  this.completed = completed;
}

Затем мы можем использовать конструктор функции Todo для создания нового объекта todo.

const todo = new Todo("Learn", false);
//Todo {title: "Learn", completed: false}

Конструктор функций Builder

Функции являются значениями, поэтому мы можем создать новую функцию, возвращающую эту функцию-конструктор.

function createConstructor(){
  return function(title, completed){
    this.title = title;
    this.completed = completed;
  }
}

Затем мы используем функцию построителя (createConstructor), чтобы создать конструктор Todo.

const Todo = createConstructor();

Когда у нас есть конструктор Todo, мы можем создать новый объект todo.

const todo = new Todo("Learn", false);
//{title: "Learn", completed: false}

Мы можем сделать createConstructor более универсальным, взяв в качестве входных данных все возможные имена свойств. В возвращаемой функции-конструкторе мы используем эти имена свойств, чтобы установить соответствующие значения для текущего объекта.

function createConstructor(...propNames){
  return function(...propValues){
    propNames.forEach((name, idx) => {
      this[name] = propValues[idx];
    });
  }
}

Обратите внимание, что если свойство title является первым при вызове построителя (createConstructor), то соответствующее значение появляется первым при вызове функции конструктора (Todo).

Ниже приведен пример динамического построения конструктора функции Todo, а затем его использования для создания нового объекта todo.

const Todo = createConstructor('title', 'completed');
const todo = new Todo("Learn", false);
//{title: "Learn", completed: false}

Выражение класса

Выражение класса позволяет определять класс с именем или без имени. Это похоже на выражение функции.

Как и выражение функции, выражение класса может быть возвращено функцией. Ниже приведена предыдущая функция построителя, возвращающая выражение класса. Возвращаемое выражение класса строит те же объекты, что и предыдущая возвращенная функция-конструктор.

function createConstructor(...propNames){
  return class {
    constructor(...propValues){
      propNames.forEach((name, idx) => {
        this[name] = propValues[idx];
      });
    }
  }
}

Ниже приведен пример динамического построения класса Todo, а затем его использования для создания нового объекта todo.

const Todo = createConstructor('title', 'completed');
const todo = new Todo("Learn", false);
//{title: "Learn", completed: false}

Это все. Спасибо за чтение.