В чём принципальная разница при определении методов у прототипа объекта в JS для двух вариантов?

Question

[fobos]

Есть два варианта определения функции конструктора и его методов прототипа.
В чём их принципиальная разница? На сколько корректно пользоваться вариантом 2? Могут ли при этом встретиться какие-то подводные камни?

// Variant 1
function Obj(prop1, prop2) {
this.p1 = prop1;
this.p2 = prop2;
}

Obj.prototype.greet = function() {
alert(this.p1);
}
Obj.prototype.getP2 = function() {
return this.p2;
}

// Variant 2
function Obj(prop1, prop2) {
this.p1 = prop1;
this.p2 = prop2;
}

Obj.prototype = {
greet : function() {
alert(this.p1);
},
getP2 : function() {
return this.p2;
}
}


Answer 1

[Анатолий]

Показываю наглядно:

function q(){}
q.prototype.w = 2;
console.log(new q().w); // 2
q.prototype = {
    e : 3
}
console.log(new q().w); // undefined
console.log(new q().e); // 3

Comments

[Анатолий]

Если честно, не знаю почему Вам первым делом это не пришло в голову. prototype по сути тоже свойство.

Answer 2

[pratamishus]

Первый вариант «правильный» (хотя это зависит от предпочтений иногда :))

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

Второй вариант иногда НУЖНО использовать по требованиям самого алгоритма, таких как комплексные цепи наследственности (inheritance)

Думаю все ясно объяснил. В терминологии могут быть ошибки т.к. образование получил и работаю не на русском :)

Comments

[gro]

Э… вы не правы

Answer 3

[lahmatiy]

Когда вы создаете функцию она имеет свойство prototype, это «пустой» объект. Фактически экземпляры будут наследоваться от Object. Когда вы присваиваете prototype другой объект, то экземпляры будут наследоваться от его прототипа. В вашем примере вы присваиваете анонимный объект, который наследуется от Object. Таким образом для вашего примера принципиальной разницы нет. По большей части кому как нравится, или как удобнее в определенной ситуации.
Я бы не сказал, что здесь есть какие то подводные камни, если понимаете как устроены объекты в js. Многое зависит от того чего вы хотите добиться. Например, если вы прототипам разных классов присвоите один и тот же объект, то у них будет как бы один прототип — то есть не происходит копирование/дополнение свойств, а происходит обычное присвоение.
Но если вы присваиваете анонимный объект в прототип, то скорей всего проблем не будет.

Стоит так же помнить что присвоение в prototype другого объекта используется для наследования.
На хабре довольно много материалов про наследование и вообще про javascript (например поиск по «javascript наследование prototype» выдает много интересных статей). Ознакомьтесь с ними.
Когда вы будете понимать механизм работы prototype, то у вас не будет возникать подобных вопросов.

Answer 4

[gro]

Во втором случае вы не сможете достучаться до конструктора и прототипа через .constructor и .constructor.prototype, если это вам, конечно, надо.