javascript - Backbone : annoying behaviour of prototype object

Question

我知道这是 javascript 本身的问题(或行为)，而不是 Backbone 的扩展方法，但我想知道避免它的最佳策略是什么。

让我们更好地把它放在代码中:

var MyModel = Backbone.Model.extend({
  value: 0,
  values: []
});

var myFirstModel = new MyModel();

myFirstModel.value // 0, as expected
myFirstModel.values // [], as expected

var mySecondModel = new MyModel();

mySecondModel.value = 2;
mySecondModel.values.push(2)

mySecondModel.value // 2, as expected
mySecondModel.values // [2], as expected

myFirstModel.value // 0, as expected
myFirstModel.values // [2], ... WAT!!!

我明白问题是我没有为 mySecondModel.values 分配新值我只是对原型(prototype)中的值变量进行操作，即 MyModel.prototype.values(与任何其他相同的问题当然是对象)

但这很容易搞砸。最直观的做法是将它们视为实例变量，而不是每个实例共有的变量(基于类的语言中的静态或类变量)。

到目前为止，我找到的一般解决方案是在初始化方法中初始化每个变量，如下所示:

var MyModel = Backbone.Model.extend({
  initialize: function() {
    this.value = 0;
    this.values = [];
  }
});

这样一切都按预期工作，即使对于简单值(如 this.value)来说不是必需的，我发现在任何情况下都坚持这个原则要容易得多。

我想知道是否有更好(更优雅、更清晰)的解决方案来解决这个问题

Answer 1

这是 JavaScript 的原型(prototype)继承和 Array 对象是引用类型这一事实的结果。您传递给 extend 的对象的键/值对被复制到 MyModel 的原型(prototype)上，因此它们将被 MyModel 的所有实例共享>。因为 values 是一个数组，所以当您修改它时，您修改了每个实例的数组。

通过在 initialize 中设置 values 所做的事情称为隐藏原型(prototype)，这是解决此问题的正确方法。

也就是说，在 Backbone.Model 的情况下，如果您试图处理模型的属性，您可以使用 defaults 函数来提供这样的默认值:

var MyModel = Backbone.Model.extend({
  defaults: function() {
    return {
      value: 0,
      values: []
    }
  }
});

同样，这仅适用于实例的属性。

var inst = new MyModel();

// The defaults will be created for each new model,
// so this will always return a new array.
var values = inst.get('values');

对于您正在做的事情，在模型本身上指定属性的地方，您可以像您所做的那样在 initialize 中设置默认值。