В чем разница между свойствами функции и свойствами её prototype?

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

Свойства функции (статические свойства)

Когда вы добавляете свойство или метод непосредственно к функции, оно становится её собственным свойством. Эти свойства часто называют статическими. Они принадлежат самой функции-конструктору как объекту и не передаются экземплярам, созданным с помощью оператора new. Они полезны для утилитарных методов, которые логически связаны с конструктором, но не требуют экземпляра.

function Car(model) {
  this.model = model;
}
// Статическое свойство функции
Car.defaultModel = 'Unknown';
// Статический метод
Car.getDefault = function() {
  return Car.defaultModel;
};

const myCar = new Car('Tesla');
console.log(myCar.model); // 'Tesla'
console.log(myCar.defaultModel); // undefined - не наследуется!
console.log(Car.getDefault()); // 'Unknown' - вызывается у конструктора

Свойства объекта prototype

Каждая функция (кроме стрелочных) при создании получает свойство prototype, которое является обычным объектом. Свойства и методы, добавленные в этот объект, становятся доступны всем экземплярам, созданным через new Constructor(). При создании экземпляра его внутренняя ссылка [[Prototype]] (доступная через __proto__ или Object.getPrototypeOf()) устанавливается на объект Constructor.prototype. Это основа прототипного наследования.

function Car(model) {
  this.model = model;
}
// Метод добавляется в prototype
Car.prototype.getModel = function() {
  return this.model;
};
// Свойство добавляется в prototype
Car.prototype.wheels = 4;

const myCar = new Car('Tesla');
console.log(myCar.getModel()); // 'Tesla' - метод найден в прототипе
console.log(myCar.wheels); // 4 - свойство найдено в прототипе
console.log(Object.getPrototypeOf(myCar) === Car.prototype); // true

Практическое применение и вывод

Статические свойства функции используются для функциональности, относящейся ко всему классу в целом (например, методы-утилиты Array.isArray, Math.max или константы). Свойства prototype используются для определения методов и общих свойств, которые должны быть у каждого экземпляра. При поиске свойства в объекте JavaScript сначала проверяет собственные свойства экземпляра, а затем поднимается по цепочке прототипов.

Итог: Используйте статические свойства для методов/данных, общих для конструктора, и свойства prototype для методов/данных, общих для всех экземпляров. Это ключевой паттерн для организации кода и реализации наследования в JavaScript до появления классов ES6.