JavaScript - Конструкторы объектов

Здравствуйте, начинающие программисты! Сегодня мы окунемся в fascinирующий мир конструкторов объектов JavaScript. Как ваш добрый сосед по компьютерным наукам, я рад помочь вам в этом путешествии. Так что наденьте свои виртуальные каски и давайте начнем создавать объекты!

Конструкторы объектов

Представьте, что вы управляете магическим зоомагазином. У вас есть много разных животных, у каждого из которых свои особенности. Вместо того чтобы писать каждого животного separately, не было бы замечательно, если бы мы могли создать план для наших животных? Именно это и делают конструкторы объектов в JavaScript!

Конструктор объектов похож на фабрику, которая производит объекты с одинаковыми свойствами и методами. Давайте создадим простой конструктор для наших магических животных:

function MagicalPet(name, species, specialPower) {
this.name = name;
this.species = species;
this.specialPower = specialPower;
this.introduce = function() {
console.log(`Привет, я ${this.name}, ${this.species} с силой ${this.specialPower}!`);
};
}

Давайте разберем это:

1. Мы определяем функцию под названием MagicalPet с параметрами для имени, вида и особой силы.
2. Внутри функции мы используем this для присвоения этих параметров в качестве свойств объекта.
3. Мы также определяем метод под названием introduce, который выводит приветствие.

Чтобы создать нового магического животного, мы используем ключевое слово new:

let fluffy = new MagicalPet("Fluffy", "дракон", "дыхание огнем");
fluffy.introduce(); // Вывод: Привет, я Fluffy, дракон с силой дыхание огнем!

Вот и все! Мы только что создали нашего первого магического животного с помощью конструктора объектов. Неужели это не здорово?

Добавление свойства или метода к конструктору

Иногда после создания нашего конструктора мы можем понять, что забыли добавить важное свойство или метод. Не волнуйтесь! Мы можем добавить их позже, используя прототип.

Давайте добавим свойство age и метод birthday к нашему MagicalPet:

MagicalPet.prototype.age = 0;
MagicalPet.prototype.birthday = function() {
this.age++;
console.log(`${this.name} теперь ${this.age} лет!`);
};

Теперь каждое магическое животное будет иметь возраст (начиная с 0) и сможет庆祝овать дни рождения:

fluffy.birthday(); // Вывод: Fluffy теперь 1 лет!
fluffy.birthday(); // Вывод: Fluffy теперь 2 лет!

Прототип JavaScript объекта

Вы можете спросить: "Что за штука 'прототип', которую мы только что использовали?" Ну, представьте это как shared backpack (общий рюкзак), который все объекты, созданные из одного и того же конструктора, носят с собой. Anything (что-либо) мы положим в этот рюкзак будет доступно всем объектам.

Когда мы добавляем свойства или методы к прототипу, мы essentially (по сути) кладем их в этот shared backpack. Это более экономично с точки зрения памяти, чем добавлять их напрямую к каждому объекту, особенно если у нас много объектов.

Вот визуальное представление:

Конструктор MagicalPet
|
v
Прототип (Общий рюкзак)
- age
- birthday()
|
v
Индивидуальные объекты MagicalPet
- name
- species
- specialPower
- introduce()

Встроенные конструкторы объектов в JavaScript

JavaScript предоставляет несколько встроенных конструкторов объектов, которые вы часто будете использовать в своих coding adventures (программных путешествиях). Давайте рассмотрим некоторые из них:

Конструктор	Описание	Пример
String()	Создает строковые объекты	let greeting = new String("Hello");
Number()	Создает числовые объекты	let age = new Number(25);
Boolean()	Создает булевы объекты	let isAwesome = new Boolean(true);
Array()	Создает массивные объекты	let fruits = new Array("apple", "banana", "cherry");
Object()	Создает общие объекты	let emptyObj = new Object();
Date()	Создает объекты даты	let today = new Date();

Хотя эти конструкторы доступны, стоит отметить, что для примитивных типов, таких как строки, числа и булевы значения, более常见 и эффективнее использовать литералы:

let greeting = "Hello";            // preferable over new String("Hello")
let age = 25;                      // preferable over new Number(25)
let isAwesome = true;              // preferable over new Boolean(true)
let fruits = ["apple", "banana"];  // preferable over new Array("apple", "banana")

Однако конструкторы, такие как Date(), часто используются, как показано:

let birthday = new Date("1990-01-01");
console.log(birthday.getFullYear()); // Вывод: 1990

И вот мы и добрались до конца, мои молодые волшебники кода! Мы путешествовали по миру конструкторов объектов JavaScript, добавляли магические свойства и методы, исследовали mystic prototype (таинственный прототип) и даже заглянули в некоторые встроенные конструкторы.

помните, что практика делает perfect (идеальным). Попробуйте создать свои собственные конструкторы, может быть, для разных типов заклинаний или магических существ. Чем больше вы играете с этими концепциями, тем естественнее они станут.

Продолжайте программировать, продолжайте учиться и, самое главное, продолжайте наслаждаться! До нашей следующей lesson (урока), пусть ваш код будет свободен от ошибок и ваши compile times (время компиляции) будут быстрыми!

Credits: Image by storyset