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..


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

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


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

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


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