javascript - ExtJs 继承行为

Question

有人可以向我解释这种行为吗？让我们声明一个类：

Ext.define('baseClass',{
    a:null,
    ar:[],

    add:function(v) {
        this.ar.push(v);
    },
    sayAr:function() {
        console.log(this.ar);
    },

    setA:function(v) {
        this.a= v;
    },
    sayA:function() {
        console.log(this.a);
    }
});

现在我创建两个对象

var a = Ext.create('baseClass');
var b = Ext.create('baseClass');

测试属性

a.setA(1);
b.setA(2);

a.sayA();
b.sayA();

这输出

1
2

一切正常，但是

a.add(1);
b.add(2);

a.sayAr();
b.sayAr();

我们得到

[1,2]
[1,2]

这个我不明白。为什么它对两个对象使用单独的“a”属性但一个“ar”数组。“ar”未声明为静态！我完全不明白。

Answer 1

当你在类声明中放入一些东西时，这意味着它被推送到对象原型上（阅读：它被所有实例共享）。对于字符串/数字/布尔值，这并不是真正的问题，但对于对象和数组，您会看到这种行为生效。

如果您希望每个实例都有一个数组/对象，那么您需要在实例中显式添加它：

Ext.define('baseClass',{
    a:null,

    constructor: function(){
        this.ar = [];
    }

    add:function(v) {
        this.ar.push(v);
    },
    sayAr:function() {
        console.log(this.ar);
    },

    setA:function(v) {
        this.a= v;
    },
    sayA:function() {
        console.log(this.a);
    }
});

Answer 2

那是因为这里有一点：

Ext.define('baseClass',{
   a:null,
   ar:[], <--------------------------- you're instantiating an array object!

为了更清楚，上面的代码等价于：

Ext.define('baseClass',{
   a:null,
   ar:new Array(),

所以两个对象共享同一个数组，因为对象构造函数只复制对数组的引用而不是完整的数组对象。

不确定 Ext.js 如何处理构造函数/初始化器，但您需要在对象构造期间创建数组，而不是在声明它时创建....

好的，谷歌搜索给了我这个：

Ext.define('baseClass',{
    constructor: function () {
        this.ar = [];
    },

那应该可以解决您的问题。