使用原型或内联扩展对象有什么区别？

Question

有什么不同？有没有？

var Likes = function (el) {
  this.el = $(el);
  return this;
};

Likes.prototype.add = function (name) {
  this.el.find('.no-results').remove();
  $('<li>', { text: name }).appendTo(this.el);
};

和:

var Likes = function (el) {
  this.el = $(el);
  this.add = function (name) {
    this.el.find('.no-results').remove();
    $('<li>', { text: name }).appendTo(this.el);
  };
  return this;
};

Answer 1

区别在于如何创建对象.当您在对象的原型上定义函数时,它会为该对象的每个其他实例定义ONCE.

如果在实例级别声明函数,则每次声明函数时都会重新定义它们.

它实际上对性能有影响http://jsperf.com/prototype-vs-instance-functions

通常认为将原型用于将在构造函数的多个实例上重用的函数是最佳实践.例如,如果您使用new运算符来创建构造函数的实例.

var Likes = function (el) {
  this.el = $(el);
  return this;
};

Likes.prototype.add = function (name) {
  this.el.find('.no-results').remove();
  $('<li>', { text: name }).appendTo(this.el);
};

var oneLike = new Likes();
var twoLike = new Likes();
var threeLike = new Likes();

由于add是在对象的原型上定义的,因此它只定义一次而不是每次Likes实例化.