This vs prototype

Какая разница между определением метода "area" как свойства "this" вместо "prototype"?

//console.clear()

function Rectangle(w, h) 
{
    this.width = w;
    this.height = h;
    this.area = function( ) { return this.width * this.height; }
}


var r = new Rectangle(2, 3);
var a = r.area( );

//console.log(a)

function Square(s) 
{
    this.side= s;
}

Square.prototype.area = function(){return this.side * this.side; }

var r = new Square(2);
var a = r.area( );

//console.log(a)

В JavaScript - The definitive guide в разделе Prototypes and Inheritance of Chapter 9 , part 1 автор говорит, что определение метода "area" внутри объекта-прототипа полезно, но его объяснение было не совсем понятным:

".. область каждого прямоугольника объект всегда ссылается на тот же функции (кто-то может ее изменить, конечно, но вы обычно методы объекта постоянны). Неэффективно использовать регулярные свойства для методов, которые предназначенные для совместного использования всеми объектами одного класса (то есть все объекты, созданные с тем же конструктором)".

Я знаю, что этот вопрос почти похож на this один, но это не так.

Ответы

Ответ 1

Определение функции с помощью whatever = function() { ... } имеет тенденцию создавать то, что называется "замыканием", где функция может обращаться к локальным переменным функции, которая ее определяет. Когда вы говорите this.fn = function() { ... }, каждый объект получает экземпляр функции (и новое замыкание). Это часто используется для создания переменных "private" в Javascript, но поставляется со стоимостью: каждая функция (в каждом объекте) различна и занимает больше памяти.

Когда вы говорите Rectangle.prototype.fn = function() { ... }, один экземпляр функции разделяется всеми Rectangle s. Это экономит память и может свести к минимуму утечки памяти в браузерах, которые плохо работают с закрытием. Если вам не нужны члены "private" или другой такой доступ к локальным переменным определяющей функции, это обычно лучшая идея.