了解骨干网扩展

Question

我是 Backbone 的忠实粉丝，但最近在 Backbone 的扩展中遇到了一些奇怪的行为。我之所以称其为奇怪，可能是因为对意图的误解，以及不了解 javascript 工作原理的深层本质。 长话短说，在重新实例化对象时，修改任何实例的属性都会重置为默认值，修改子属性会在所有未来实例中更改它。我希望对此事有任何见解。

这是一些使用 Backbone 扩展的代码：

var myObj = function () {
    this.a = true;
};

myObj.extend = extend; //the backbone version, link provided at bottom

//the pattern used throughout backbone
var myExtension = myObj.extend({
    b: "hello"
});

var instance1 = new myExtension();
instance1.b = "goodbye";

var instance2 = new myExtension();
console.log(instance2.b); //logs hello!!

var myBadExtension = myObj.extend({
    b: {
        c: "hello"
    }
});

var bad1 = new myBadExtension();
bad1.b.c = "goodbye";

var bad2 = new myBadExtension();
console.log(bad2.b.c); //!!! logs "goodbye" !?!?!?!

非常感谢任何和所有帮助。

Link to backbone extend.

Answer 1

是的，因为bad2.b 和bad1.b 是同一个对象，来自它们的共享原型。为避免这种情况，您应该在 initialize 方法中为 b 赋值。

var myBadExtension = myObj.extend({
    initialize: function() {
      this.b = {
        c: "hello"
      };
    }
});

属性是否是原始属性（IOW 不是对象或数组）无关紧要，但我认为以相同的方式初始化原始属性更常见。

鉴于您没有使用骨干网的内置类，这可能会有更好的工作机会。

var myBadExtension = myObj.extend({
  constructor: function() {        
    myObj.apply(this, arguments);

    this.b = {
      c: "hello"
    };
  }
});