CODEWITHSUNDEEP
extjs
Alex TheHavok Manson
Alex TheHavok Manson

Reputation: 13

Ext.define confusion

I'm having an issue which makes me think I might be misinterpreting the use of the ExtJS class architecture a bit. Herewith an example of a simplified version which demonstrates the issue

        Ext.define('Person', {
            name : 'Default',
            inventory : [],
            addInventoryItem : function(item) {
                Ext.Array.push(this.inventory, item);
            },
            inventoryList : function() {
                console.log("Inventory: " + JSON.stringify(this.inventory));
            },
            setName : function(name) {
                this.name = "name";
            }
        });

        Ext.define('Student', {
            extend : 'Person'
        });

        alex = Ext.create('Student');
        alex.setName("Alex");
        alex.addInventoryItem("Knifes");
        alex.inventoryList();

        david = Ext.create('Student');
        david.setName("David");
        david.addInventoryItem("Forks");
        david.inventoryList();

Output: 

Inventory: ["Knifes"]
Inventory: ["Knifes","Forks"]

Expected Output:

Inventory: ["Knifes"]
Inventory: ["Forks"]

I would've expected the actual result in the event of overriding the class, but fail to understand why my second instance affects the superclass, and in turn reflects changes made by my first instance.

Upvotes: 1

Views: 54

Answers (1)

Rob Agar
Rob Agar

Reputation: 12469

The problem is that there is a single inventory array shared between all instances of your class. The array is created once at the time the class is defined, then each instance just gets a reference to that one array.

Basically you need to give each Person instance its own inventory array on creation, like this:

Ext.define('Person', {
  ...
  constructor: function() {
    this.inventory = [];
  },
  ...
});

Upvotes: 2

Related Questions