7

有什么不同?有没有?

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;
};
4

3 回答 3

6

不同之处在于对象的创建方式。当您在对象的原型上定义函数时,它会为该对象的每个进一步实例定义一次。

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

它实际上对性能有影响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实例化时。

于 2013-05-24T15:52:51.457 回答
2

示例 2 是更好的实践,因为它有助于实现继承,而不是浪费地复制对象属性。

在没有继承的小型应用程序中,这两个示例之间可能没有太大的实际区别。但是想象一下,Likes在一个使用继承的更复杂的应用程序中,您有 10000 个构造函数实例。对于第二个示例,他们每个人都将在add本地收到该函数的副本。

从理论上讲,这可能会在更大的应用程序中导致内存瓶颈。此外,如果您想add在将来更改该方法,则需要在每个本地对象上执行此操作。

于 2013-05-24T15:46:22.000 回答
2

是,有一点不同。

如果您使用原型对象,则“喜欢”的所有创建对象都将对原型对象具有相同的引用。但是如果你使用第二种方法(this.add),它会为每个创建的对象添加函数。

第一个比第二个更喜欢方法。

于 2013-05-24T15:41:13.353 回答