Widget的类变量和构造函数中初始化数组的区别？

Question

如果我在小部件的类变量中或在它的构造函数中初始化数组有区别吗？

要清楚，这（声明1）有什么区别：

define([
        "dojo/_base/declare" //
        , "dijit/_WidgetBase" //
        , "dojox/dtl/_Templated"
        , 'dojo/domReady!'
        ], function(declare, WidgetBase, Templated){
    return declare([WidgetBase, Templated], {
            controls: [],
            constructor: function(params, srcNodeRef){
                this.inherited(arguments);
            }
});

还有这个（声明 2）：

define([
        "dojo/_base/declare" //
        , "dijit/_WidgetBase" //
        , "dojox/dtl/_Templated"
        , 'dojo/domReady!'
        ], function(declare, WidgetBase, Templated){
    return declare([WidgetBase, Templated], {
            constructor: function(params, srcNodeRef){
                this.inherited(arguments);
                this.controls= [];
            }
});

这些声明的区别在于属性controls。在声明 1 中，它被初始化为类成员变量。在声明 2 中，它在构造函数中初始化，并且类引用它。

我注意到的是，如果我们使用声明 1，那么 widget.controls 数组将在小部件的不同实例之间共享。需要明确的是，如果我们使用声明 1 并执行以下操作：

var widget1= new Widget();
var widget2= new Widget();

那么，widget1.controls 指的是与widget2.controls 相同的数组。声明 2 不是这种情况。如果我们使用声明 1 和声明 2 的组合，即如果我们将 controls: null 放入类成员变量并在构造函数中初始化 this.controls= []，则情况也并非如此。所以声明 3 变为：

define([
        "dojo/_base/declare" //
        , "dijit/_WidgetBase" //
        , "dojox/dtl/_Templated"
        , 'dojo/domReady!'
        ], function(declare, WidgetBase, Templated){
    return declare([WidgetBase, Templated], {
            controls: null,
            constructor: function(params, srcNodeRef){
                this.inherited(arguments);
                this.controls= [];
            }
});

这也符合我的预期。关于我哪里出错或我在这里不理解的任何想法？

谢谢！ :)

Answer 1

这种行为的原因是简单类型是按值分配的，而对象是按引用分配的，在 JavaScript 数组中是对象（在您的情况下为 controls）。

如果您的类包含数组或其他对象，则应在constructor() 中声明它们，以便每个实例都有自己的副本。

字符串、数字、布尔值、null等简单类型可以直接在类中声明，因为简单类型是按值赋值的。

例子：

define(["dojo/_base/declare", "my/Foo"], function(declare, Foo){
  return declare(null, {
    arr: [ 1, 2, 3, 4 ], // object. shared by all instances!
    num: 5,              // simple type value non-object. not shared.
    str: "string",       // simple type value non-object. not shared.
    obj: new Foo(),      // object. shared by all instances!

    constructor: function(){
      this.arr = [ 1, 2, 3, 4 ]; // per-instance object.
      this.obj = new Foo();      // per-instance object.
    }
  });
});