Что такое цепочка прототипов?

👨‍💻 Frontend Developer 🟠 Может встретиться 🎚️ Сложный
#JavaScript #Объекты #База JS

Краткий ответ

Цепочка прототипов — это механизм наследования в JavaScript, при котором объекты могут получать свойства и методы от других объектов. Когда вы обращаетесь к свойству объекта, JavaScript сначала ищет его в самом объекте, а если не находит — идёт по цепочке прототипов вверх, пока не найдёт или не дойдёт до конца.


Полный ответ

Цепочка прототипов — это способ, которым JavaScript реализует наследование. Это очень важная концепция, которая лежит в основе работы с объектами.

Что такое прототип

Каждый объект в JavaScript имеет прототип — другой объект, от которого он наследует свойства:

const obj = {};
console.log(obj.toString); // Метод из прототипа

Как работает цепочка

Когда вы обращаетесь к свойству объекта:

  1. JavaScript ищет свойство в самом объекте
  2. Если не находит — идёт к прототипу
  3. И так далее по цепочке
  4. Если дошёл до конца — возвращает undefined

Простые примеры

Обычный объект

const user = { name: 'Иван' };
// user не имеет метода toString, но может его использовать
console.log(user.toString()); // Работает через прототип

Создание с прототипом

const parent = { surname: 'Иванов' };
const child = Object.create(parent);
child.name = 'Петр';
 
console.log(child.name); // 'Петр' — свойство объекта
console.log(child.surname); // 'Иванов' — из прототипа

Важные особенности

1. Поиск по цепочке

const obj = {};
// obj.toString → Object.prototype.toString
// obj.valueOf → Object.prototype.valueOf

2. Без прототипа

const cleanObj = Object.create(null);
// Нет цепочки прототипов
console.log(cleanObj.toString); // undefined

Когда полезна цепочка прототипов

Наследование свойств

// Все массивы имеют методы из Array.prototype
const arr = [1, 2, 3];
console.log(arr.length); // Собственное свойство
console.log(arr.push); // Из Array.prototype

Расширение функциональности

// Можно добавить метод всем объектам
Object.prototype.sayHello = function() {
  return 'Привет!';
};
 
const obj = {};
console.log(obj.sayHello()); // 'Привет!'

Частые ошибки

1. Не понимание наследования

// ❌ Думаем, что toString — свойство объекта
const obj = { name: 'Иван' };
console.log(obj.hasOwnProperty('toString')); // false!
 
// ✅ Правильное понимание
console.log('toString' in obj); // true — через прототип

2. Изменение встроенных прототипов

// ❌ Опасно — влияет на весь код
Array.prototype.myMethod = function() {};
 
// ✅ Лучше — создавать свои классы
class MyArray extends Array {}

Простые правила

  1. Цепочка — путь от объекта к его прототипам
  2. Поиск — сначала в объекте, потом по цепочке
  3. Наследование — получение свойств от прототипов
  4. Object.prototype — вершина большинства цепочек
  5. Конец — если дошли до null, свойства нет

Понимание цепочки прототипов помогает лучше понимать, как работают объекты и наследование в JavaScript.


Хотите больше статей для подготовки к собеседованиям? Подписывайтесь на EasyAdvice, добавляйте сайт в закладки и совершенствуйтесь каждый день 💪