Что делает новое ключевое слово в JavaScript и как его использовать?
Не имея опыта объектно-ориентированного программирования, ключевое слово new
в JavaScript заняло у меня некоторое время, чтобы понять. Этот пост направлен на то, чтобы закрепить мои собственные знания и, надеюсь, помочь всем, кто может бороться с этой темой.
Для тех, кто может быть не знаком, основная идея ООП заключается в том, что мы можем использовать объекты (более известные как классы в других языках программирования) как автономные фрагменты кода для разработки наших приложений.
Технически в языке программирования JavaScript нет классов, но есть конструкторы и прототипы, которые обеспечивают аналогичные функции.
Конструкторы похожи на обычные функции, однако мы вызываем их с помощью ключевого слова new
.
function Cake() { console.log('this function makes a cake!'); } const myCake = new Cake();
Считается хорошим соглашением использовать заглавные буквы в имени функции-конструктора, чтобы помочь отличить их от обычных функций.
В приведенном выше примере последняя строка создает экземпляр Cake
и назначает его новой переменной с именем myCake
. Если мы зарегистрируем эту новую переменную, мы увидим, что получаем наш строковый вывод и объект Cake
.
console.log(myCake); // this function makes a cake! // Cake {} __proto__: constructor: ƒ Cake() __proto__: Object
Неважно, какое значение будет возвращено исходной функцией, если мы сделаем вызов конструктора, мы всегда получим объект взамен. Конструктор Cake
ничего не делает, кроме записи строки в консоль, но myCake
по-прежнему является ее экземпляром. Мы можем проверить это с помощью оператора instanceof
.
console.log(typeof myCake); // object console.log( myCake instanceof Cake); // true
При вызове функции с использованием ключевого слова new
происходит несколько вещей:
- Он создает новый пустой объект с типом объекта
- Он устанавливает внутреннее свойство
prototype
какprototype
функции построения - Он связывает переменную
this
с вновь созданным объектом - Он выполняет функцию конструктора с использованием нового объекта всякий раз, когда упоминается
this
. - Возвращает новый объект
Основное назначение конструкторов - они позволяют нам реализовать код создания многократно используемых объектов.
function User(name, department) { this.name = name; this.department = department; this.isAdmin = true; } const user = new User('Roy', 'IT Support'); console.log(user); // User {name: "Roy", department: "IT Support", isAdmin: true}
Теперь, если нам нужно создать других пользователей, мы можем просто сделать следующее:
const user2 = new User('Douglas', 'Management'); console.log(user2); // User {name: "Douglas", department: "Management", isAdmin: true} const user3 = new User('Jen', 'IT Dept'); console.log(user3); // User {name: "Jen", department: "IT Dept", isAdmin: true}
JavaScript также предоставляет функции конструктора для многих встроенных языковых объектов, таких как объект Date
.
const myDate = new Date('September 1, 2025'); console.dir(myDate); // Mon Sep 01 2025 00:00:00 GMT+1000 (Australian Eastern Standard Time) console.log(myDate.getFullYear()); // 2025 console.log(myDate.getMonth()); // 8 console.log(myDate.getDay()); // 1
Резюме
- Функции-конструкторы или конструкторы похожи на обычные функции, но по общему мнению, их имена должны начинаться с заглавной буквы.
- Конструкторы вызываются с помощью ключевого слова
new
- Если мы вызовем конструктор, мы всегда получим объект взамен.
- Основное назначение конструкторов - они позволяют нам реализовать код создания многократно используемых объектов.
- JavaScript предоставляет функции конструктора для множества встроенных объектов, например
Date