Egy gyakori (kezdők által gyakran elkövetett) hibára szeretném felhívni a figyelmet. JavaScript-ben a prototípus alapú öröklődés kapcsán, ha egy "osztályleírásban" szerepel egy tömb (vagy objektum), akkor az összes példány ugyanazt a tömböt (vagy objektumot) fogja megkapni.
Ext.define('Sample.BadComponent', {
extend: 'Ext.Component',
list: [],
initComponent: function () {
this.list.push(':)');
console.log(this.list);
this.callParent(arguments);
}
});
Ext.create('Sample.BadComponent');
Ext.create('Sample.BadComponent');
Az eredmény:
[":)"]
[":)", ":)"]
A megfelelő működéshez a tömböt a komponens létrehozáskor kell elkészíteni:
Ext.define('Sample.GoodComponent', {
extend: 'Ext.Component',
initComponent: function () {
this.createList();
this.list.push(':)');
console.log(this.list);
this.callParent(arguments);
},
createList: function () {
this.list = [];
}
});
Ext.create('Sample.GoodComponent');
Ext.create('Sample.GoodComponent');
Igaz, sok esetben az ilyen hibák azért maradnak rejtve, mert nem a "közös" listát használják a komponensek, hanem komponens létrehozásakor adunk át újat!
Ext.create('Sample.BadComponent', {list: []});
Ext.create('Sample.BadComponent', {list: []});
Így a fenti hiba nem jelentkezik, de tudjunk róla, hogy akkor is rossz mintát használunk.