Search code examples
javascriptextjsextjs4

Best Practices concerning initComponent() in Ext.define()


I'm writing all my components in ExtJS's new MVC fashion using Ext.define().

I struggle a bit whether define properties inside of initComponent() or by simply setting them like property: 42,.

Are there widely accepted best practices?

I'm staggering between using initComponent() only when necessary (ie. when I want something dynamic or set a scope) which keeps the function shorter and spares me some ugly this.s and using it always which has the benefit, that I'd never have to move former properties to initComponent() just because I want to make it more dynamic.

Unfortunately, Sencha's docs don't tell much about that and the available examples seem to do as they want.


Solution

  • Personal practice, I will declare variables in the properties area when the

    • variables defining magnitude, like x, y, width, height
    • variables that awaiting to be overridden, or customizable, like title, saveBtnTxt, url, fields, iconCls
    • some constants, that will have special prefixes so will not be overridden so easily

    Then I will declare items, listeners, this.on, Ext.apply(me, {..}) or anything that requires the scope of the obj (this, me), to sit inside my initComponent. Or stuff that should be modified/overridden before everything is setting up so user will not break my component by overriding some of the important variables.

    Of course that'll serve as my guidance. 2 cents

    EDIT

    About the ugly this, I have used the variable me widely in my app, and it looks a lot cleaner than this. It benefits me from changing scopes less frequently too.