JavaScript Intensive tutorial--cocos2d-js JavaScript inheritance

The JavaScript language itself does not provide a class, and there is no class inheritance mechanism for other languages, its inheritance is implemented through the object's prototype, but this does not meet the requirements of the COCOS2D-JS engine. Since the COCOS2D-JS engine evolved from cocos2d-x, almost all of the APIs in the early versions of Cocos2d-js cocos2d-html were designed to emulate the Cocos2d-x API, and Cocos2d-x itself was written in C + +, Many of these objects and functions are complex, and the JavaScript language is somewhat out of the picture.
In the open source community John Resiq in his blog (Http://ejohn.org/blog/simple-j ... ance/) provides a simple JavaScript inheritance (easy JavaScript inheritance) method.
John Resiq's simple JavaScript inheritance approach is inspired by the prototype inheritance mechanism, which has the same class concepts as object-oriented classes like Java, and he has designed the root class of all classes, with the following code:
 

/* simple javascript inheritance   * by john resig http:// Ejohn.org/   * mit licensed.   */  // inspired by  base2 and Prototype   (function () {    var initializing  = false, fntest = /xyz/.test (function () {xyz;})  ? /\b_super\b/ : /.*/;       // the base  Class implementation  (does nothing)     this. Class = function () {};       // create a new  class that inherits from this class    class.extend =  function (prop)  {      var _super = this.prototype;            // Instantiate a base class  (but only create the instance,      //  don ' T run the init constructor)       initializing  = true;      var prototype = new this ();       initializing = false;            // copy the properties over onto the new prototype       for  (Var name in prop)  {         // check if we ' Re overwriting an existing function         prototype[name] = typeof prop[name] ==   "function"  &&          typeof _super [name] ==  "FunctioN " && fntest.test (Prop[name])  ?            (function (NAME, FN) {            return  function ()  {              var  tmp = this._super;                            // add a  new ._super ()  method that is the same method               // but on the super-class               this._super = _ super[name];                     &nbsP;      // the method only need to be bound  temporarily, so we               // remove it when we ' re done executing               var ret = fn.apply (this, arguments);                        this._super = tmp;                             return ret;            };           }) (Name, prop[name])  :           prop[name];      }            // The dummy class constructor      function  Class ()  {        // All construction is  Actually done in the init method        if   ( !initializing && this.init )            this.init.apply (this, arguments);      }            // Populate our constructed  prototype object      class.prototype = prototype;            // Enforce the constructor to  Be what we expect      class.prototype.constructor = class;          // And make this class extendable       class.extend = arguments.callee;            return class;    };  }) ();

As with object in Java, all classes inherit directly or indirectly from class, followed by inheriting class instances:

Var person = class.extend ({                                               ①       init: function  (isdancing)  {                                                   ②          this.dancing =  isdancing;      },      dance: function   ()  {                                                      ③           return this.dancing;      }   });       var ninja = person.extend ({                                                ④      init: function  ()  {                                                        ⑤           this._super (False);                                               ⑥       },      dance: function  ()  {                                                       ⑦           // call the inherited version of dance ()     &Nbsp;     return this._super ();                                                  ⑧      },      swingSword:  function  ()  {                                                 ⑨           return true;      }  }) ;       var p = new person (True);                                                  ⑩  console.log (P.dance ());// true                                                       var n = new ninja ();                                                              console.log (n.dance()); // false                                                     Console.log (N.swingsword ());  // true

If you are familiar with the Java language Object-oriented, it should be easy to read. Where the ① line of code is the declaration of the Person class, which inherits from Class,class.extend () represents the inheritance from class. The ② code defines the constructor init, which functions as an initialization property. The ③ line code is defined as the normal function dance (), which can return the property dancing.
The ④ line of code is declaring that the Ninja class inherits from the person class, the ⑤ line code of the definition constructor init, where the This._super (false) statement is called by the parent class constructor to initialize the property in the parent class, as shown in the Code section ⑥ line. The ⑦ line code overrides the dance () function, which overrides the dance () function of the parent class. The ⑧ Line code is this._super () is the dance () function that invokes the parent class. The ⑨ line code is a subclass ninja the newly added function Swingsword ().
The ⑩ Line code creates a P object from the person class, and the argument to the constructor is true. The first line of code is the print log P object Dance property, and the result is true.
The first line of code creates n objects through the Ninja class, the constructor's arguments are null, and the default initialization uses false to initialize the dance property in the parent class. Therefore, print to false in line code.
This simple JavaScript inheritance method actually implements the inheritance and polymorphism mechanism of object-oriented concept in the general sense. This simple JavaScript inheritance approach is at the heart of the Cocos2d-js inheritance mechanism, and COCOS2D-JS is slightly modified, and familiarity with the use of simple JavaScript inheritance is very important for understanding and learning Cocos2d-js.

This article ish5eduAgency officialHTML5 Trainingtutorials, the main introduction:JavaScript Intensive TutorialsJavaScript inheritance in--cocos2d-js
 

JavaScript in intensive tutorial--cocos2d-js