Что такое prototype

Вопрос

Что такое prototype

Профессия

Frontend Developer

Что хочет услышать интервьюер

Интервьюер хочет услышать четкое понимание концепции прототипов в JavaScript, их роли в наследовании и примера использования. Также важно показать, как это связано с реальной разработкой.

Ключевые тезисы

• Prototype — это объект, который используется в JavaScript для реализации наследования.
• Каждый объект в JavaScript имеет скрытое свойство [[Prototype]], которое ссылается на другой объект или null.
• Когда мы пытаемся получить доступ к свойству или методу объекта, и оно не найдено, JavaScript ищет его в цепочке прототипов.
• Методы и свойства можно добавлять через prototype, чтобы они были доступны всем экземплярам объекта.
• Пример: Array.prototype содержит методы, доступные всем массивам.

Подробный ответ

В JavaScript прототип (prototype) — это объект, который используется для реализации наследования и позволяет объектам делиться методами и свойствами. Каждый объект в JavaScript имеет скрытое свойство [[Prototype]], которое ссылается на другой объект или null. Этот механизм называется прототипным наследованием. Когда вы пытаетесь получить доступ к свойству или методу объекта, и оно не найдено в самом объекте, JavaScript автоматически ищет его в цепочке прототипов. Это продолжается до тех пор, пока свойство не будет найдено или пока цепочка не закончится (когда [[Prototype]] равен null). Например, все массивы в JavaScript наследуют методы из Array.prototype, такие как push, pop и map. Это позволяет использовать эти методы на любом массиве, даже если они не определены непосредственно в самом массиве. Прототипное наследование является ключевым механизмом в JavaScript, который отличает его от классического наследования, используемого в других языках программирования.

Практические примеры

Пример 1

Пример создания объекта с определенным прототипом:

const animal = { sound: '...' };
const dog = Object.create(animal);
dog.sound = 'Woof!';
console.log(dog.sound); // 'Woof!'
console.log(dog.hasOwnProperty('sound')); // true

Пример 2

Пример добавления метода в прототип существующего объекта:

function Person(name) {
  this.name = name;
}
Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name}`);
};

const person = new Person('Alice');
person.greet(); // 'Hello, my name is Alice'

Пример 3

Пример работы цепочки прототипов:

const parent = { value: 42 };
const child = Object.create(parent);
console.log(child.value); // 42

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

• Путаница между __proto__ и prototype: __proto__ — это свойство экземпляра объекта, которое ссылается на его прототип, а prototype — это свойство функции-конструктора, которое используется для создания прототипа новых экземпляров.
• Попытка изменить прототип объекта после его создания с помощью __proto__, что может привести к неожиданным результатам и снижению производительности.

Связанные темы

• Прототипное наследование в JavaScript
• Функции-конструкторы и ключевое слово new
• Классы в ES6 и их связь с прототипами
• Методы Object.create, Object.setPrototypeOf и Object.getPrototypeOf

Follow-up вопросы

Как создать объект с определенным прототипом?

Уровень: basic

Для этого можно использовать метод Object.create(), который принимает прототип в качестве аргумента и возвращает новый объект с этим прототипом.

Чем отличается __proto__ от prototype?

Уровень: intermediate

__proto__ — это свойство объекта, которое ссылается на его прототип. prototype — это свойство функции-конструктора, которое используется для создания прототипа объектов, созданных через эту функцию.

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

Уровень: intermediate

Когда JavaScript ищет свойство или метод объекта, он сначала проверяет сам объект. Если не находит, то переходит к его прототипу ([[Prototype]]). Этот процесс повторяется до тех пор, пока не будет найден элемент или не достигнут конец цепочки (прототип null).

Можно ли изменить прототип объекта после его создания?

Уровень: advanced

Да, прототип можно изменить с помощью методов Object.setPrototypeOf() или прямого присваивания __proto__. Однако это не рекомендуется из-за возможного снижения производительности.

Как добавить метод в прототип существующего объекта?

Уровень: basic

Метод можно добавить через Object.prototype или прототип конкретного конструктора. Например, Array.prototype.newMethod = function() { ... } добавит метод всем массивам.