Разница между добавлением функции в прототип и литералом объекта в javascript

Если у меня есть конструктор Quo

var Quo = function (string) {
     this.status = string;
};

а затем создал новый объект с помощью var myQuo = new Quo("confused");

какая разница:

Quo.get_status = function () { 
    return this.status;
};

Quo.prototype.get_status = function () { 
    return this.status;
};

Ответ 1

Предположим, что вы создали myQuo, как вы описали

var myQuo = new Quo("confused");

Если вы определяете get_status как свойство Quo, то для получения статуса myQuo вам нужно позвонить Quo.get_status. Тем не менее, Quo.get_status должен знать контекст объекта (myQuo), чтобы вернуть правильное значение статуса. Вы можете переопределить функцию, чтобы принять объект в качестве аргумента, как показано ниже:

Quo.get_status = function (quo) { 
  return quo.status;
};
var status = Quo.get_status(myQuo);

В качестве альтернативы вы можете сохранить функцию Quo.get_status, как вы ее написали в своем вопросе, но вам нужно будет вызвать эту функцию способом, который связывает myQuo с "this":

Quo.get_status = function() {
  return this.status;
};
var status = Quo.get_status.call(myQuo);

Любое решение неудобно. Предпочтительным решением является использование функциональности Javascript-прототипа и определение get_status как функции прототипа, которая будет доступна локально для всех объектов Quo, таких как myQuo.

Quo.prototype.get_status = function () { 
  return this.status;
};
var status = myQuo.get_status();

Ответ 2

Когда вы определяете функцию, у нее есть свойство prototype, которое используется как [[prototype]] для всех создаваемых объектов с помощью ключевого слова new. Когда вы добавляете членов в Quo.prototype, все объекты, созданные с помощью new Quo(), смогут читать член, как если бы они были (через их [[prototype]], а именно Quo.prototype). С другой стороны, если вы назначаете членов Quo напрямую, вы можете получить доступ к ним только через Quo.

Пример:

var Quo = function (status) {
    this.status = status;
}

Quo.status = "enlightened";

Quo.get_status = function() {
    return this.status;
}

Quo.prototype.get_status = function() {
    return this.status;
}

var quo = new Quo("confused");

Quo.get_status(); // "enlightened"
quo.get_status(); // "confused"