Уявіть, що ви живете в магічному селі, де знання передаються від предків. У селі є унікальне правило:
“Якщо ви чогось не знаєте, запитайте у батька. Якщо батько не знає, запитайте у дідуся, і так далі, поки не досягнете старійшини села.”
Це правило відображає, як працює ланцюг прототипів в JavaScript!
Поясніть інтерв'юеру через цю історію, він або вона будуть вражені.
Магічне село та ланцюг прототипів JavaScript
Давайте познайомимося з Алексом, жителем цього села. Алекс — це студент, але він хоче навчитися готувати.
💡 Спочатку Алекс перевіряє свої знання. Якщо він не знає, як готувати, він запитує у свого батька (Прототип Студента).
💡 Якщо батько не знає, він запитує у свого дідуся (Прототип Людини).
💡 Якщо дідусь не знає, він запитує у Старійшини села (Прототип Об'єкта).
// Дідусь (Конструктор Людини)
function Person(name) {
this.name = name;
}
// Додаємо метод до прототипу Людини
Person.prototype.walk = function () {
return `${this.name} is walking`;
};
// Батько (Конструктор Студента)
function Student(name, grade) {
Person.call(this, name); // Наслідування властивостей
this.grade = grade;
}
// Наслідуємо методи від Людини
Student.prototype = Object.create(Person.prototype);
// Додаємо метод до Студента
Student.prototype.study = function () {
return `${this.name} is studying in grade ${this.grade}`;
};
// Дитина (Алекс - екземпляр Студента)
let alex = new Student("Alex", 10);
console.log(alex.study()); // Alex is studying in grade 10 (Власна властивість)
console.log(alex.walk()); // Alex is walking (Наслідувано від Людини)
console.log(alex.toString()); // [object Object] (Наслідувано від Прототипу Об'єкта)
Тут в alex.walk() — Студент не має власного методу walk. Тому спочатку він перевірить свій власний прототип (студента), якщо не знайде, перевірить прототип Людини. Якщо не знайде в методі Людини, то перевірить прототип Об'єкта. Якщо метод знайдено в будь-якому з прототипів, JavaScript просто поверне його.
Як працює ланцюг прототипів тут
1️⃣ Алекс (екземпляр Студента) спочатку шукає у своєму об'єкті → знаходить study().
2️⃣ Якщо метод не знайдено, JavaScript перевіряє прототип Студента → знаходить walk() з Person.
3️⃣ Якщо все ще не знайдено, він переходить до прототипу Людини, який наслідує від прототипу Об'єкта (останній предок).
Цей ланцюг пошуку називається ланцюгом прототипів!
Чому це корисно?
✅ Ефективність пам'яті: Замість того, щоб копіювати методи в кожен об'єкт, вони спільно використовуються.
✅ Повторне використання: Методи можна додавати один раз і наслідувати кількома об'єктами.
✅ Гнучкість: Об'єкти можуть перевизначати успадковані методи, коли це необхідно.
Перекладено з: JavaScript Interview Question : Prototype Chaining