2014-06-25 2 views
10

Viele Codebeispiele verwenden Ext.apply wenn Eigenschaften auf einer Komponente in der initcomponent Verfahren einstellen.Warum Ext.apply in initcomponent

Beispiel:

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

Meine Frage ist, was der Unterschied ist, dass es so dabei, im Vergleich zu ihm auf diese Weise tun:

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

Für mich scheint es mehr auf diese Weise lesbar. Aber fehlt mir etwas, das ich von Ext.apply bekomme?

Antwort

11

Ext.apply() wird verwendet, um das Kopieren vieler Eigenschaften von einem Quell- auf ein Zielobjekt zu vereinfachen (meistens haben die Quell- und Zielobjekte unterschiedliche Eigenschaften) und es kann außerdem verwendet werden, um Standardwerte (dritte Streit).

Beachten Sie, dass es keine tiefen Klone machen wird! Wenn Sie ein Array oder ein Objekt als Eigenschaftswert haben, wird die Referenz angewendet!

Es gibt auch eine applyIf(), die nur Eigenschaften kopiert, die nicht bereits im Zielobjekt existieren. In einigen Fällen haben beide Implementierungen auch den Vorteil, die Referenz des kopierten Objekts zu löschen.

Hinweis: Ihr zweiter Weg wird nicht funktionieren, weil Sie this fehlen.

+0

das 'das' behoben –

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

würde initialisieren nichts, meinen Sie

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

, die die gleiche wie Ihr Beispiel funktioniert mit Ext.apply. Aber Ext.apply zeigt seine Macht in komplexeren Fällen, z.B.

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} 

Dies wird oft verwendet, um Standardoptionen von Komponenten mit bestimmten Init-Parametern zu überschreiben.

+0

danke, ja (habe das vergessen) –