Explain this strange JavaScript Class declaration in core lib

[sean12341]

Hello,

I am trying to understand how AEM's core library works, with as example this `EditorKernel.js` file in the CRXDE located at "/libs/clientlibs/granite/richtext/core/js/EditorKernel.js".

As you can see in its Class declaration syntax below, it is not how we normally declare JavaScript classes. It looks like it is using MooTools (https://mootools.net/core) by passing an object into a class function?

CUI.rte.EditorKernel = new Class({
    //...
});

However, I am not able to find anywhere that references MooTools as a dependency, not in CRXDE nor the Sources tab of the Chrome inspector.

Could someone help me understand:

1. Where is the MooTools dependency referenced?
2. If it is not using MooTools, then how to explain the non-standard javascript syntax?

Thanks,

[Nupur_Jain · Accepted solution]

Hi @sean12341 

The syntax you see here totally aligns with JS standard. It is just that the name "Class" that makes the whole thing confusing. 

Now check Js file in libs which is /libs/clientlibs/granite/richtext/base/Class.js.

Here, Class  is being defined as JS Object which is then declared to be a function and takes one parameter which it expects to be js object. Check lines in js file mentioned:

var Class, Exception;
(function() {
    var e = function(a) {
        var b = a.bind(this);
        b._methodName = a._methodName;
        return this[b._methodName] = b
    }
      , a = function(a) {
        a.extend = this;
        return new Class(a)
    };
    Class = function(b) {
        b = b || {};

Now, if you check https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new "new" operator can then be used on any function to declare further objects as explained in documentation https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new like

car1 = new Car('Eagle', 'Talon TSi', 1993);

Hope it explains.

Thanks,

Nupur