Tutoriel d'amélioration de JavaScript - Héritage JavaScript dans Cocos2d-JS

Le langage JavaScript lui-même ne fournit pas de classes et il n'existe pas de mécanisme d'héritage de classe dans d'autres langages. Son héritage est implémenté via le prototype de l'objet, mais cela ne peut pas répondre aux exigences du moteur Cocos2d-JS. Depuis que le moteur Cocos2d-JS a évolué à partir de Cocos2d-x, presque toutes les API de Cocos2d-HTML, la première version de Cocos2d-JS, ont été conçues pour simuler l'API Cocos2d-x elle-même a été écrite en C . les objets et les fonctions sont relativement complexes et le langage JavaScript est quelque peu incapable de les décrire.
Dans la communauté open source, John Resiq propose une méthode d'héritage JavaScript simple (Simple JavaScript Inheritance) dans son blog (http://ejohn.org/blog/simple-j ... ance/).
La méthode d'héritage JavaScript simple de John Resiq s'inspire du mécanisme d'héritage prototypique. Elle a le même concept de classe que les objets orientés objet tels que Java, et il a conçu la classe racine Class pour toutes les classes. 🎜>

/* 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];  
             
            // 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;  
  };  
})();

Comme Object en Java, toutes les classes héritent directement ou indirectement de Class. Voici un exemple d'héritage de Class :

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()  
        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

Si vous êtes familier avec la nature orientée objet. du langage Java, cela devrait être facile à comprendre. La ligne 1 du code déclare la classe Person, qui hérite de Class, et Class.extend() indique qu'elle hérite de Class. La ligne 2 du code définit le constructeur init, qui est utilisé pour initialiser les propriétés. La ligne 3 du code définit la fonction ordinaire dance(), qui peut renvoyer l'attribut dancing.

La ④ ligne de code déclare que la classe Ninja hérite de la classe Person. La ⑤ ligne de code définit le constructeur init Dans cette fonction, l'instruction this._super(false) appelle le constructeur de la classe parent pour initialiser les attributs. dans la classe parent. Voir la ligne ⑥ du code. La ligne 7 du code consiste à réécrire la fonction dance(), qui remplacera la fonction dance() de la classe parent. La ligne 8 du code est this._super() appelle la fonction dance() de la classe parent. La ligne 9 de code est la fonction swingSword() nouvellement ajoutée de la sous-classe Ninja.
La ligne ⑩ du code crée l'objet p via la classe Person, et le paramètre du constructeur est vrai. La première ligne de code imprime l'attribut dance de l'objet log p, et le résultat est vrai.
La première ligne de code crée l'objet n via la classe Ninja. Les paramètres du constructeur sont vides. L'initialisation par défaut utilise false pour initialiser l'attribut dance dans la classe parent. La ligne 1 du code s'affiche donc faux.
Cette méthode d'héritage JavaScript simple implémente en fait le mécanisme d'héritage et de polymorphisme des concepts orientés objet dans un sens général. Cette méthode d'héritage JavaScript simple est au cœur du mécanisme d'héritage Cocos2d-JS. La familiarité avec l'utilisation de l'héritage JavaScript simple est très importante pour comprendre et apprendre Cocos2d-JS.

Ce qui précède est le contenu du didacticiel d'amélioration de JavaScript - Héritage JavaScript dans Cocos2d-JS Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !