Search code examples
javascriptextjsextjs4

Difference between new and new Ext.create in ExtJS


I'm just new to ExtJS 4(project using Ext JS4)

My question is 'Difference new and new Ext.create'

These code is show completely same result (except height, width)

var panel1 = Ext.create('Ext.panel.Panel', {
    title: 'use Ext.create',
    html: 'use Ext.create',
    height: 100,
    width: 300
})

var panel2 = new Ext.panel.Panel({
    title: 'use new',
    html: 'use new',
    height: 100,
    width: 120
});

var panel3 = new Ext.create('Ext.panel.Panel', {
    title: 'use new Ext.create',
    html: 'use new Ext.create',
    height: 100,
    width: 200
});

i know new vs Ext.create (for dynamic loading - 'new' is not supporting dynamic loading)

but what is 'new Ext.create' ? Is it a syntax should not use?

PS : I am unfamiliar with posting questions. I apologize

Please tell me if something is wrong in this question.


Solution

  • This is not a syntax you should use. It seems to result in the same outcome only because of the way Ext.create is implemented. However, if it were changed this syntax may fail to work. The new operator creates a new object that inherits from the prototype of Ext.create. That prototype is Function, not Ext.panel.Panel. Additionally, it changes the scope in which create is called from Ext to this new object. It is by chance that the create method does not reference the scope (i.e. "this"). Ext.create makes its own call to new and returns a different object that is the panel you're expecting, so the new operator in this statement creates an extra object that is not a panel and never used.