CODEWITHSUNDEEP
extjsextjs4
Tejas C
Tejas C

Reputation: 413

Class extending Ext.data.Model - methods .get and .set behaves differently compare to getter/setter

When i am creating the model by extending "Ext.data.Model" class, getter/setter methods are behaving differently than default .get and .set methods available from data.Model

It seems like one can either use getter/setter methods or .get/.set methods, because they seem to be maintaining separate set of fields.

Why is it so? Parden me if question looks silly, i am learning Ext JS an trying to understand how it works. I am using library version ExtJS4.2.1

Class

Ext.define("Ext.model.Invoice", {
        extend : "Ext.data.Model",
        fields : [{name : 'id'}, {name : 'taxId'}, {name : 'name'}],
        config : {
            name : 'Tejas',
            taxId : '23746'
        },
        constructor : function(config) {
            this.callParent(arguments);
            this.initConfig(config);
        }
    });

HTML

Ext.onReady(function() {
    var invoice = Ext.create("Ext.model.Invoice");

    console.log("Before, invoice.get('name'):", invoice.get('name'));
    console.log("Before, invoice.getName():", invoice.getName());

    //Modifying name
    invoice.setName("Mr. Smith");
    invoice.set("name","Mr. Tony");
    console.log("Updating names using setName and set('name')");

    console.log("After, invoice.get('name'):", invoice.get('name'));
    console.log("After, invoice.getName():", invoice.getName());

});

OUTPUT

Before, invoice.get('name'):
Before, invoice.getName(): Tejas
Updating names using setName and set('name')
After, invoice.get('name'): Mr. Tony
After, invoice.getName(): Mr. Smith

Upvotes: 1

Views: 602

Answers (1)

Akatum
Akatum

Reputation: 4016

With config configuration property you are defining list of configuration options with their default values, but not default model data.

When instance of object is creating, for each property defined in config is automatically created setter and getter method, and object property with same name as config property.

Ext.data.Model stores model data in its private data property. For example you can try to dump model data for name field by: 

console.log(invoice.data.name);

So by setter and getter you access object property, but by model.get() and model.set() you access model's data stored in model's private data property.

Upvotes: 1

Related Questions