Конструкторы в JavaScript
Создавать объекты по одному — это медленно. Если вам нужно десять студентов с одинаковыми свойствами, вы тратите время на многократное написание одного и того же кода.
JavaScript решает эту проблему с помощью функций-конструкторов (Constructor Functions).
Представьте, что конструктор — это чертеж. Чертеж дома — это еще не сам дом, но с его помощью можно построить множество домов.
Как это работает:
Конструктор — это специальная функция. Для создания объектов на его основе используется ключевое слово new.
Пример:
function Student(name, age, city) {
this.name = name;
this.age = age;
this.city = city;
}
const student1 = new Student("John", 21, "Chennai");
const student2 = new Student("David", 22, "Madurai");
Зачем это использовать?
- Это экономит время.
- Это предотвращает дублирование кода.
- Это создает стандартную структуру для ваших данных.
Роль this:
Внутри конструктора слово this относится к новому объекту, который вы создаете.
Если учитель говорит «мой класс», слово «мой» указывает на конкретного учителя. В коде this.name указывает на имя конкретного объекта, который вы только что создали.
Что происходит при использовании new?
Когда вы запускаете const emp = new Employee("John", 50000), происходит четыре шага:
- JavaScript создает пустой объект.
- Ключевое слово
thisуказывает на этот новый объект. - Свойства добавляются в объект.
- Объект возвращается вам.
Добавление действий:
Объекты могут не только хранить данные, но и выполнять действия. В программировании такие действия называются методами.
Пример:
function Laptop(brand, ram) {
this.brand = brand;
this.ram = ram;
this.showDetails = function() {
console.log(this.brand, this.ram);
};
}
Объект Laptop теперь содержит данные и функцию для их отображения.
Лучшие практики:
- Всегда пишите первую букву конструктора с заглавной. Используйте
Student, а неstudent. Это подсказывает другим разработчикам, что нужно использовать ключевое словоnew. - Всегда используйте ключевое слово
new. Если вы забудете его, функция будет работать как обычная функция, что приведет к ошибкам в коде.
Сравнение:
Объектные литералы:
- Хороши для одного единственного объекта.
- Просты и быстры.
- Нет чертежа.
Функции-конструкторы:
- Хороши для множества объектов.
- Повторно используемы и организованы.
- Используют подход на основе чертежа.
Source: https://www.w3schools.com/js/js_object_constructors.asp Source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor Full post: https://dev.to/annapoo/constructor-in-javascript-4nbm