TGViewer
Руслан Куянец | Reactify Руслан Куянец | Reactify @reactify_it · 6.44K subscribers
Post #1329 2.65K
🖥 Функция-конструктор в JavaScript

Она позволяет задавать шаблон для объектов, чтобы каждый новый объект, созданный через этот конструктор, имел определенные свойства и методы. Давайте разберем, как работает функция-конструктор.

✏️ Создание функции-конструктора
Функция-конструктор выглядит как обычная функция, но она пишется с заглавной буквы по соглашению, чтобы отличаться от других функций. Внутри конструктора используется this для задания свойств создаваемого объекта.


function Person(name, age) {
this.name = name; // свойство name
this.age = age; // свойство age
}


🎮 Создание объектов с помощью конструктора
Чтобы создать объект с помощью конструктора, используется оператор new. Он:

- Создает новый пустой объект.
- Связывает его с this внутри конструктора.
- Возвращает этот объект.


const person1 = new Person("Alice", 25);
console.log(person1.name); // Alice
console.log(person1.age); // 25


➕ Добавление методов в конструктор
Если мы добавим метод прямо в конструктор, то он будет копироваться в каждый новый объект, что может тратить память.


function Person(name, age) {
this.name = name;
this.age = age;
this.sayHello = function() {
console.log(`Hi, I'm ${this.name}`);
};
}

const person1 = new Person("Alice", 25);
person1.sayHello(); // Hi, I'm Alice


⚙️ Оптимизация с prototype
Для методов можно использовать prototype, чтобы метод существовал в одном экземпляре и не копировался для каждого объекта.


function Person(name, age) {
this.name = name;
this.age = age;
}

Person.prototype.sayHello = function() {
console.log(`Hi, I'm ${this.name}`);
};

const person1 = new Person("Alice", 25);
const person2 = new Person("Bob", 30);

person1.sayHello(); // Hi, I'm Alice
person2.sayHello(); // Hi, I'm Bob


💭 Как работает this в конструкторе
В функции-конструкторе this указывает на новый объект, который создается при вызове через new. Это позволяет настраивать свойства и методы нового объекта.

💎 Продвинутые аспекты
- Наследование. Используя прототипы, можно создавать наследуемые свойства и методы.
- Проверка с instanceof. Для проверки, создан ли объект через конструктор, можно использовать instanceof.


console.log(person1 instanceof Person); // true


#javascript #this #function
  • 👍 18
  • 🔥 5
  • 💯 1
More from @reactify_it
  1. Oct 8, 2026Последний месяц жестко марафонил :) С утра до вечера, без выходных. Решил наконец подвести…
  2. Oct 2, 2026Что вообще для меня значит ИТ-АДАПТАЦИЯ? Это — РАБОТА ЛЮБОЙ ЦЕНОЙ. Сейчас такое время, ког…
  3. Oct 1, 2026А тем временем цены растут. Бесплатный ChatGPT, во-первых, как будто отупел, во-вторых, ли…
  4. Sep 30, 2026Ребята, если у вас уже есть опыт, но вы чувствуете, что он выглядит «непродающим» в резюме…
  5. Sep 29, 2026👩‍💻 ВСЯ инфраструктура за 30 минут: Kubernetes, ArgoCD, Grafana, CI/CD https://www.youtu…
  6. Sep 28, 2026В общем, что-то такое получилось 😁 Превью сделано нейронкой, но буду переделывать с помощ…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →