Что делает новое ключевое слово в 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