О концепции прототипирования в JavaScript

Question

В приведенном ниже коде у меня есть класс под названием Foo, и я добавляю прототип, называемый data, который является массивом, и я добавляю функцию showData в качестве прототипа для класса.

var Foo = function (name) 
{ 
    this.name = name; 
}; 
Foo.prototype.data = [1, 2, 3]; // setting a non-primitive property 
Foo.prototype.showData = function() 
{ 
    console.log(this.name, this.data); 
}; 

Вопрос заключается в том, есть ли разница, если я определить данные и showData внутри класса Foo, как:

var Foo = function (name) 
    { 
     this.name = name; 
     this.data = [1, 2, 3]; 
     this.showData = function() 
     { 
      console.log(this.name, this.data); 
     }; 
    }; 

Answer 1

Да, есть большая разница.

В первом случае массив data используется всеми экземплярами Foo. Так что если вы измените свойство одного экземпляров, все модифицируется:

var f1 = new Foo(), 
    f2 = new Foo(); 
f2.data[2] = 4; // also changes f1.data 

Он также потребляет меньше памяти, из-за это разделение, но это, вероятно, не ваша забота друг от друга, если вы создаете много экземпляров Foo (обратите внимание, что в JS, как часто в gc-языках, потребляющих память, не только плохо из-за потребления памяти, но и из-за процессора, используемого для его мусора).

Но установка свойства prototype сложно, так как поиск всегда начинается с childest элемента: если вы установите f2.data = [1,2,4], то вы измените f2.data, но не изменять f1.data (это производит 2 различных массивов).

Answer 2

Основное отличие состоит в том, что путем добавления свойств к прототипу вы добавляете их ко всем экземплярам Foo, даже те, которые уже созданы.

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