JavaScript语言本身没有提供类,没有其它语言的类继承机制,它的继承是通过对象的原型实现的,但这不能满足Cocos2d-JS引擎的要求。由于Cocos2d-JS引擎是从Cocos2d-x演变而来的,在Cocos2d-JS的早期版本Cocos2d-HTML中几乎全部的API都是模拟Cocos2d-x API而设计的,Cocos2d-x本身是有C++编写的,其中的很多对象和函数比较复杂,JavaScript语言描述起来有些力不从心了。
在开源社区中John Resiq在他的博客(http://ejohn.org/blog/simple-javascript-inheritance/)中提供了一种简单JavaScript继承(Simple JavaScript Inheritance)方法。
John Resiq的简单JavaScript继承方法灵感来源于原型继承机制,它具有与Java等面向对象一样的类概念,并且他设计了所有类的根类Class,它的代码如下:

  1. /* Simple JavaScript Inheritance
  2. * By John Resig http://ejohn.org/
  3. * MIT Licensed.
  4. */
  5. // Inspired by base2 and Prototype
  6. (function(){
  7. var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/;
  8. // The base Class implementation (does nothing)
  9. this.Class = function(){};
  10. // Create a new Class that inherits from this class
  11. Class.extend = function(prop) {
  12. var _super = this.prototype;
  13. // Instantiate a base class (but only create the instance,
  14. // don't run the init constructor)
  15. initializing = true;
  16. var prototype = new this();
  17. initializing = false;
  18. // Copy the properties over onto the new prototype
  19. for (var name in prop) {
  20. // Check if we're overwriting an existing function
  21. prototype[name] = typeof prop[name] == "function" &&
  22. typeof _super[name] == "function" && fnTest.test(prop[name]) ?
  23. (function(name, fn){
  24. return function() {
  25. var tmp = this._super;
  26. // Add a new ._super() method that is the same method
  27. // but on the super-class
  28. this._super = _super[name];
  29. // The method only need to be bound temporarily, so we
  30. // remove it when we're done executing
  31. var ret = fn.apply(this, arguments);
  32. this._super = tmp;
  33. return ret;
  34. };
  35. })(name, prop[name]) :
  36. prop[name];
  37. }
  38. // The dummy class constructor
  39. function Class() {
  40. // All construction is actually done in the init method
  41. if ( !initializing && this.init )
  42. this.init.apply(this, arguments);
  43. }
  44. // Populate our constructed prototype object
  45. Class.prototype = prototype;
  46. // Enforce the constructor to be what we expect
  47. Class.prototype.constructor = Class;
  48. // And make this class extendable
  49. Class.extend = arguments.callee;
  50. return Class;
  51. };
  52. })();

与Java中的Object一样所有类都直接或间接继承于Class,下面是继承Class实例:

  1. var Person = Class.extend({                                             ①
  2. init: function (isDancing) {                                                ②
  3. this.dancing = isDancing;
  4. },
  5. dance: function () {                                                    ③
  6. return this.dancing;
  7. }
  8. });
  9. var Ninja = Person.extend({                                             ④
  10. init: function () {                                                     ⑤
  11. this._super(false);                                             ⑥
  12. },
  13. dance: function () {                                                    ⑦
  14. // Call the inherited version of dance()
  15. return this._super();                                               ⑧
  16. },
  17. swingSword: function () {                                               ⑨
  18. return true;
  19. }
  20. });
  21. var p = new Person(true);                                               ⑩
  22. console.log(p.dance());// true                                              ⑪
  23. var n = new Ninja();                                                        ⑫
  24. console.log(n.dance()); // false                                                ⑬
  25. console.log(n.swingSword()); // true

如果你对于Java语言的面向对象很熟悉的话,应该很容易看懂。其中第①行代码是声明Person类,它继承自Class,Class.extend()表示继承自Class。第②行代码的定义构造函数init,它的作用是初始化属性。第③行代码是定义普通函数dance(),它可以返回属性dancing。
第④行代码是声明Ninja类继承自Person类,第⑤行代码的定义构造函数init,在该函数中this._super(false)语句是调用父类构造函数初始化父类中的属性,见代码第⑥行所示。第⑦行代码是重写dance()函数,它会覆盖父类的dance()函数。第⑧行代码是this._super()是调用父类的dance()函数。第⑨行代码是子类Ninja新添加的函数swingSword()。
第⑩行代码通过Person类创建p对象,给构造函数的参数是true。第⑪行代码是打印日志p对象dance属性,结果为true。
第⑫行代码通过Ninja类创建n对象,构造函数的参数为空,默认初始化采用false初始化父类中的dance属性。因此在代码第⑬行打印为false。

这种简单JavaScript继承方法事实上实现了一般意义上的面向对象概念的继承和多态机制。这种简单JavaScript继承方法是Cocos2d-JS继承机制的核心,Cocos2d-JS稍微做了修改,熟悉简单JavaScript继承的用法对于理解和学习Cocos2d-JS非常的重要。

更多内容请关注最新Cocos图书《Cocos2d-x实战:JS卷——Cocos2d-JS开发》

本书交流讨论网站:http://www.cocoagame.net

欢迎加入Cocos2d-x技术讨论群:257760386

更多精彩视频课程请关注智捷课堂Cocos课程:http://v.51work6.com

《Cocos2d-x实战 JS卷》现已上线,各大商店均已开售:

京东:http://item.jd.com/11659698.html

欢迎关注智捷iOS课堂微信公共平台,了解最新技术文章、图书、教程信息

Cocos2d-JS中JavaScript继承的更多相关文章

  1. js中实现继承的几种方式

    首先我们了解,js中的继承是主要是由原型链实现的.那么什么是原型链呢? 由于每个实例中都有一个指向原型对象的指针,如果一个对象的原型对象,是另一个构造函数的实例,这个对象的原型对象就会指向另一个对象的 ...

  2. JS中的继承(上)

    JS中的继承(上) 学过java或者c#之类语言的同学,应该会对js的继承感到很困惑--不要问我怎么知道的,js的继承主要是基于原型(prototype)的,对js的原型感兴趣的同学,可以了解一下我之 ...

  3. JS中的继承(下)

    JS中的继承(下) 在上一篇 JS中的继承(上) 我们介绍了3种比较常用的js继承方法,如果你没看过,那么建议你先看一下,因为接下来要写的内容, 是建立在此基础上的.另外本文作为我个人的读书笔记,才疏 ...

  4. JavaScript强化教程——Cocos2d-JS中JavaScript继承

    javaScript语言本身没有提供类,没有其它语言的类继承机制,它的继承是通过对象的原型实现的,但这不能满足Cocos2d-JS引擎的要求.由于Cocos2d-JS引擎是从Cocos2d-x演变而来 ...

  5. 转:js中javascript:void(0) 真正含义

    from:http://www.jb51.net/article/71532.htm 在Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值. 我想使用过ajax的都常 ...

  6. 【学习笔记】六:面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  7. js中的继承和重载

      js中有三种继承方式:一.通过原型(prototype)实现继承 二.借用构造函数式继承,可分为通过call()方法实现继承和通过apply()方法实现继承 仅仅通过原型继承我们可以发现在实例化子 ...

  8. js中的继承

    js中继承的实现方式很多,此处给出两种常用方式. <!DOCTYPE html> <html> <head> <meta charset='UTF-8'> ...

  9. JS中对象继承方式

    JS对象继承方式 摘自<JavaScript的对象继承方式,有几种写法>,作者:peakedness 链接:https://my.oschina.net/u/3970421/blog/28 ...

随机推荐

  1. Codeforce Gym 100015I Identity Checker 暴力

    Identity Checker 题目连接: http://codeforces.com/gym/100015/attachments Description You likely have seen ...

  2. cocos2d-x 3.1.1 学习笔记[3]Action 动作

    这些动画貌似都非常多的样子,就所有都创建一次. 代码例如以下: /* 动画*/ auto sp = Sprite::create("card_bg_big_26.jpg"); Si ...

  3. Android Activity界面切换添加动画特效(转)

    在Android 2.0之后有了overridePendingTransition() ,其中里面两个参数,一个是前一个activity的退出两一个activity的进入, @Override pub ...

  4. iOS开发——多线程OC篇&多线程中的单例

    多线程中的单例 #import "DemoObj.h" @implementation DemoObj static DemoObj *instance; // 在iOS中,所有对 ...

  5. oc-25-id类型

    /** id:万能指针 能够指向任何OC对象. id = NSObject *, id cat = [Cat new]; [cat jump]; NSObject:是所有类的父类,基类.可以指向任何O ...

  6. IPC——共享内存

    Linux进程间通信——使用共享内存 下面将讲解进程间通信的另一种方式,使用共享内存.   一.什么是共享内存 顾名思义,共享内存就是允许两个不相关的进程访问同一个逻辑内存.共享内存是在两个正在运行的 ...

  7. 标准库 - unicode/utf8/utf8.go 解读

    // Copyright 2009 The Go Authors. All rights reserved. // Use of this source code is governed by a B ...

  8. 关于解决Permission is only granted to system apps

    一句话,clean一下这个Project!就OK了…… 不要被假象迷惑!

  9. c#删除转义字符的方法,删除\0后所有字符串(菜鸟级别)

    string str = "78738\01212"; string str_2= Regex.Unescape(str); int index = str_2.IndexOf(& ...

  10. Cyclic Nacklace

    Problem Description CC always becomes very depressed at the end of this month, he has checked his cr ...