Perché utilizzare Ext.apply in initComponent

Question

Numerosi esempi di codice utilizzano Est.apply quando si impostano le proprietà su un componente nel metodo initComponent.

Esempio:

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

La mia domanda è, qual è la differenza nel fare in questo modo, rispetto a farlo in questo modo:

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

Per me sembra più leggibile in questo modo. Ma mi manca qualcosa che ottengo da Ext.apply?

Answer 1

Ext.apply() viene utilizzato per semplificare la copia di molte proprietà da un'origine a un oggetto di destinazione (la maggior parte delle volte che gli oggetti di origine e di destinazione hanno diversi set di proprietà) e può inoltre essere utilizzato per applicare valori predefiniti (terzo discussione).

Nota che non creerà i cloni profondi! Significato se hai un array o un oggetto come valore di proprietà applicherà il riferimento!

C'è anche un applyIf() che copia solo le proprietà che non esistono già nell'oggetto di destinazione. In alcuni casi entrambe le implementazioni hanno anche il vantaggio di eliminare il riferimento dell'oggetto copiato.

Nota: Il tuo secondo modo non funziona perché ti manca this.

Answer 2

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

non avrebbe inizializzare nulla, vuoi dire

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

che fa la stessa come il vostro esempio utilizzando Ext.apply. Ma Ext.apply mostra il suo potere in casi più complessi, ad es.

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} 

Viene spesso utilizzato per sovrascrivere le opzioni predefinite dei componenti con determinati parametri di inizializzazione.