为什么在initComponent中使用Ext.apply

Question

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

例子：

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

我的问题是，是什么在做这样的差异，相对于做这种方式：

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

对于我来说，似乎这样更易读。但我错过了我从Ext.apply得到的东西吗？

Answer 1

Ext.apply()用于简化从源到目标对象的多个属性的复制（大部分时间源对象和目标对象具有不同的属性集），还可以用于应用默认值（第三论据）。

请注意，它不会使深层克隆！意思是如果你有一个数组或对象作为属性值，它将应用引用！

还有一个applyIf()它只复制目标对象中不存在的属性。在某些情况下，这两种实现还具有删除复制对象引用的好处。

注意： 您的第二种方法将无法正常工作，因为您缺少this。

Answer 2

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

不会初始化任何东西，你的意思是

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

这确实喜欢使用Ext.apply你的例子一样。但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} 

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