Question

Consider the example:

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.app.Application-static-method-getName

Ext.define('My.cool.Class', {
    constructor: function() {
        alert(this.self.getName()); // alerts 'My.cool.Class'
    }
});

My.cool.Class.getName(); // 'My.cool.Class'

What is the self referring to in this example?
How can I, in this documentation, know when to use this and when self and when this.self?
Why this is not working:

this.getName()

or

self.getName()

My thoughts about this are that self refers to the class of the object so the only reason I need to do this is because the getName() method is static so I’m (kinda) not calling it from object, but from class. Am I right? Am I? Ha? Ha? Am I? 😀

Answer 1

this.self refers to the class object. It means that this.self === My.cool.Class. So you can instantiate new My.cool.Class object by invoking new this.self().

The reason why this.getName() doesn’t work is because in JS static properties/methods are not available in instance.

Example:

var Class = function(){};
Class.prototype = {};

Class.staticMethod = function(){ alert('static method'); };
Class.prototype.instanceMethod = function(){ alert('instance method'); };

var instance = new Class();

Class.staticMethod(); // works
Class.instanceMethod(); // doesn't work

instance.staticMethod(); // doesn't work
instance.instanceMethod(); // works

Also static properties/methods are not available in sub class even in static context.

Example:

Ext.define('One', {
    instanceMethod: function() { alert('Instance One'); }
});
Ext.apply(One, {
    staticMethod: function() { alert('Static One'); }
});


Ext.define('Two', {
    extend: 'One'
});


One.staticMethod(); // works
Two.staticMethod(); // doesn't work

The reason why getName method is available in My.cool.Class is because there are copied from Ext.Base class in ExtClass.create method (this class is private, it’s not visible in API).
​