ExtJS check if object is an instance of an xtype

ExtJS in version 4 has some neat helpers to get you the inheritance chain of the a component. I ran into a situation where I was passing in an unknown component type and wanted to interrogate the object's type to determine what to do... essentially:

function doThing(obj) {  
  // if object is grid -> do something
  // if object is panel -> do something else
}

Components in ExtJS have properties for xtype that give you the highest level of the xtype, but what if you want to check the inheritance chain? Fortunately there are a few neat properties and methods available..

xtypesChain

This property provides an array of the entire xtype chain for the component:

obj.xtypesChain  
["component", "box", "container", "panel", "tablepanel", "gridpanel", "grid", "administration-list"]

xtypesMap

This property returns a hash of the xtypes and a true value for the entire xtype chain for the component:

obj.xtypesMap  
{component: true, box: true, container: true, panel: true, tablepanel: true, gridpanel: true, grid: true, administration-list: true}

isXType(str)

Finally, this method available on AbstractComponent will give you a true/false indicator if an object is an xtype.

obj.isXType('grid')  
true  
comments powered by Disqus