为什么在initComponent中使用Ext.apply？

Question

在设置组件的属性时，许多代码示例使用Ext.apply方法在initComponent方法中。

例如：

    initComponent: function(){
        Ext.apply(this, {
            items: {
                xtype: 'button'
            }
    })},

我的问题是，这样做和那样做的区别是什么：

    initComponent: function(){
        this.items = {
            xtype: 'button'
        }
    }

对我来说，那样更易读。但如果我不使用Ext.apply，是否会错过什么重要的东西？

- Oliver Watkins

Answer 1

Ext.apply()用于简化从源对象复制许多属性到目标对象的过程（大部分情况下，源对象和目标对象具有不同的属性集合），此外还可以用于应用默认值（第三个参数）。

请注意，它不会进行深层复制！这意味着，如果您有一个数组或一个对象作为属性值，它将应用引用！

还有一个applyIf()函数，它只复制目标对象中不存在的属性。在某些情况下，这两种实现方式也有放弃复制对象引用的好处。

注意：您的第二种方法不起作用，因为您缺少了this。

- sra

Answer 2

initComponent: function(){
    items = {
        xtype: 'button'
    }
}

您的意思是不会初始化任何内容。

initComponent: function(){
    this.items = {
        xtype: 'button'
    }
}

使用Ext.apply可以实现与你的示例相同的功能。但是在更复杂的情况下，例如：

var x = {a: 1, c:3, e:5};
Ext.apply(x, {b:2, d:4, f:6});

console.log(x); // Object {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}

这通常用于使用给定的初始化参数覆盖组件的默认选项。

- Erich Kitzmueller