В чём разница между __proto_

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

proto — это свойство каждого объекта, которое указывает на его прототип (от кого он наследует свойства). prototype — это свойство функций, которое используется как прототип для новых объектов, созданных этой функцией. proto есть у всех объектов, prototype — только у функций.

Полный ответ

Разница между proto и prototype — одна из самых запутанных тем в JavaScript. Важно понимать, что это разные вещи, которые работают по-разному.

Что такое proto

Это свойство любого объекта, которое указывает на его прототип:

const obj = {};
console.log(obj.__proto__); // Прототип объекта

Что такое prototype

Это свойство функций, которое становится прототипом для новых объектов:

function User() {}
console.log(User.prototype); // Прототип для новых объектов

Главные отличия

proto

Есть у всех объектов
Указывает на прототип текущего объекта
Используется для наследования

prototype

Есть только у функций
Используется как шаблон для новых объектов
Определяет, что будут наследовать новые объекты

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

Работа с proto

const parent = { name: 'Родитель' };
const child = Object.create(parent);
 
console.log(child.__proto__ === parent); // true
console.log(child.name); // 'Родитель' — через __proto__

Работа с prototype

function User(name) {
  this.name = name;
}
 
User.prototype.sayHello = function() {
  return 'Привет, ' + this.name;
};
 
const user = new User('Иван');
console.log(user.sayHello()); // 'Привет, Иван' — метод из prototype

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

1. Связь между ними

function User() {}
 
const user = new User();
// user.__proto__ === User.prototype
console.log(user.__proto__ === User.prototype); // true

2. Цепочка наследования

function User() {}
User.prototype.method = function() {};
 
const user = new User();
// user → user.__proto__ (User.prototype) → Object.prototype → null

Когда использовать что

proto для проверки

const obj = {};
// Проверить прототип объекта
console.log(obj.__proto__ === Object.prototype); // true

prototype для расширения

function Animal() {}
// Добавить метод всем будущим объектам
Animal.prototype.speak = function() {
  console.log('Я животное');
};

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

1. Путаница в назначении

// ❌ Думаем, что они одно и то же
const obj = {};
console.log(obj.__proto__); // Прототип объекта
console.log(obj.prototype); // undefined — у объектов нет prototype
 
// ✅ Правильное понимание
function Func() {}
console.log(Func.prototype); // Есть только у функций

2. Изменение prototype после создания

// ❌ Может не работать как ожидается
function User() {}
const user = new User();
 
User.prototype.method = function() {};
// user может не иметь доступа к новому методу в некоторых случаях
 
// ✅ Лучше добавлять методы до создания объектов

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

proto — у всех объектов, указывает на прототип
prototype — только у функций, шаблон для новых объектов
Связь — obj.proto === Func.prototype для новых объектов
Назначение — proto для наследования, prototype для создания
Проверка — используй proto чтобы посмотреть прототип

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

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

В чём разница между __proto__ и prototype?