javascript - 函数原型(prototype)对象在另一个实例上被更改

Question

我试图将默认对象值放入函数的原型(prototype)中。但这导致原型(prototype)“默认”对象被另一个实例更改。为什么会发生这种情况？我知道我可以将默认对象放入函数内，但这不是我想要做的。有人可以解释一下为什么原型(prototype)变量被第二个实例覆盖吗？演示在这里:https://jsfiddle.net/c0zg5vjp/2/

window.foo = function(options) {

    this.settings = jQuery.extend({}, this.defaults, options || {});

    this.bar = function() {

        this.settings.classes.push('new_class');
    }
}

window.foo.prototype.defaults = { 'classes' : ['default'] };

var instance = new foo();

instance.bar();

var instance_2 = new foo();

instance_2.bar();

alert( instance_2.settings.classes.join() );

Answer 1

jQuery.extend({}, this.defaults

正在一个新对象上设置一个名为classes的属性，并将其设置为与原始对象相同的指向数组['default']的内存指针。

换句话说，两个实例都有单独的“设置”对象，它们都有一个指向同一数组的 classes 属性。

您应该使用扩展的“深层”版本:https://api.jquery.com/jquery.extend/#jQuery-extend-deep-target-object1-objectN

jQuery.extend(true, {}, this.defaults, ...

它会递归到你的数组中并克隆它。