1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    12
    Vote Rating
    0
    masm is on a distinguished road

      0  

    Question Answered: What's the point in Ext.apply()?

    Sorry, for the newcomer's stupid question, but I don't get what's the point in Ext.apply()?

    If it just copies provided properties to the specified object, what's the difference between following two snippets?
    Code:
    Ext.define('MyApp.LoginWindow',{
        extend:'Ext.Window',
    
        title:'Log in',
    
       initComponent:function(){
            Ext.apply(this,{
                items:[
                    {
                        xtype: 'textfield',
                        name : 'username',
                       fieldname: 'Username'
                    },
                    ...
                ]});
    }});
    Code:
    Ext.define('MyApp.LoginWindow',{
       extend:'Ext.Window',
    
        title:'Log in',
    
        items : [
            // as above
        ]
    
        initComponent:function(){
            ...
        }
    });

  2. In the 2nd one, you run the risk of those items being shared among all instances of that class. The first will always create a new array so the items are unique to each instance.

  3. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    38,546
    Vote Rating
    1119
    Answers
    3700
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default

    In the 2nd one, you run the risk of those items being shared among all instances of that class. The first will always create a new array so the items are unique to each instance.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    12
    Vote Rating
    0
    masm is on a distinguished road

      0  

    Default

    Thanks! It definitely makes sense.

  5. #4
    Sencha User PulpMysteryFan's Avatar
    Join Date
    Aug 2008
    Posts
    98
    Vote Rating
    3
    Answers
    1
    PulpMysteryFan is on a distinguished road

      0  

    Default

    It does not make sense to me. Can you elaborate on how the second alternative can lead to the items being shared among all instances of the class? Thanks! :-)

  6. #5
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    38,546
    Vote Rating
    1119
    Answers
    3700
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default

    Objects and Arrays when used are not like strings and booleans... they are just references to the actual Object and Array in the browser. So if you use the same object in 3 places and only update it in one of the places, the other two will reflect the change.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  7. #6
    Sencha User PulpMysteryFan's Avatar
    Join Date
    Aug 2008
    Posts
    98
    Vote Rating
    3
    Answers
    1
    PulpMysteryFan is on a distinguished road

      0  

    Default

    Sorry to be dense, but... I understand that arrays are objects. I don't see how that relates to the example at hand.

    I stared at it for a while, and here's a difference I see. In the example, using Ext.apply() in initConfig() results in the items property being overritten with the specified values, regardless of what the calling routine passes as the config object's items attribute. In the example without Ext.apply(), the calling routine's values will be used. So this use of apply is good in those cases where you need to ignore the calling routine's values. Is that right?

    How about setting this.items to the array in initComponent()? Does Ext.apply() differ from that?
    Code:
    initComponent: function(){
    this.items = [{xtype: 'textfield', name: , name: 'username'}]; ...
    }
    versus
    Code:
    initComponent: function(){
    Ext.apply(this, {items: [{xtype: 'textfield', name: , name: 'username'}]}); ...
    }
    Thanks for the help! :-)

  8. #7
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,784
    Vote Rating
    379
    Answers
    580
    skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute skirtle has a reputation beyond repute

      0  

    Default

    The two examples you have posted are effectively the same. In the second of the original examples the items array was specified directly as part of the Ext.define, which results in it being copied to the class's prototype. That array is created immediately and is shared. This is different to creating the array in initComponent, which happens for each instance. Sharing an array or object is not necessarily a problem but obviously there can be issues if 2 objects share the same object/array to hold some aspect of their state.

    Some further information on this topic:

    http://skirtlesden.com/articles/conf...-the-prototype

  9. #8
    Sencha User PulpMysteryFan's Avatar
    Join Date
    Aug 2008
    Posts
    98
    Vote Rating
    3
    Answers
    1
    PulpMysteryFan is on a distinguished road

      0  

    Default

    Excellent article skirtle. Thanks!

    :-)