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-j ... ance/)中提供了一种简单JavaScript继承(Simple JavaScript Inheritance)方法。
John Resiq的简单JavaScript继承方法灵感来源于原型继承机制,它具有与Java等面向对象一样的类概念,并且他设计了所有类的根类Class,它的代码如下:

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

与Java中的Object一样所有类都直接或间接继承于Class,下面是继承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

如果你对于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非常的重要。

本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— Cocos2d-JS中JavaScript继承

JavaScript强化教程——Cocos2d-JS中JavaScript继承的更多相关文章

  1. JavaScript强化教程 -- cocosjs场景切换

    场景切换 在main.js,将StartScene作为我们初始化运行的场景,代码如下: cc.LoaderScene.preload(g_resources, function () { cc.dir ...

  2. JavaScript强化教程——jQuery AJAX 实例

    什么是 AJAX?AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML).简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据 ...

  3. JavaScript强化教程 —— Cocos2d-JS的屏幕适配方案

    1. 设置屏幕适配策略(Resolution Policy) 如果你还没有用过Resolution Policy,只需要在游戏载入过程完成之后(cc.game.onStart函数回调中),调用下面的代 ...

  4. JavaScript强化教程 - 六步实现贪食蛇

    1.首先创建div 并且给div加样式 <div id="pannel" style="width: 500px;height: 500px;z-index: 1; ...

  5. JavaScript强化教程——JavaScript 总结

    本教程中我们向您讲授了如何向 html 页面添加 JavaScript,使得网站的动态性和交互性更强. 你已经学习了如何创建对事件的响应,验证表单,以及如何根据不同的情况运行不同的脚本. 你也学到了如 ...

  6. JavaScript强化教程——jQuery UI API 类别

    ---恢复内容开始--- 主要介绍:JavaScript强化教程​—— jQuery UI API 类别 jQuery UI 在jQuery 内置的特效上添加了一些功能.jQuery UI 支持颜色动 ...

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

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

  8. javascript基础入门之js中的结构分支与循环语句

    javascript基础入门之js中的结构分支与循环语句 程序的结构①顺序结构:自上而下:②选择(分支)结构:多条路径,根据不同的条件,只执行其中一个:③循环结构:重复某些代码④配合特定的语句实现选择 ...

  9. javascript基础入门之js中的数据类型与数据转换01

    javascript基础入门之js中的数据结构与数据转换01 js的组成(ECMAScript.BOM.DOM)        js中的打印语句:        数据类型        变量      ...

随机推荐

  1. apache下virtualhost与location合用配置转发SVN控制访问

    使用apache的文件系统配置 使用virtualhost 实现location 重定向 NameVirtualHost *:80 <VirtualHost *:80> ServerNam ...

  2. PS1--cannot be loaded because the execution of scripts is disabled on this system

    在nagiosXI上,通过nsclient++ 引用plugin “check_ms_win_disk_load”(https://outsideit.net/check-ms-win-disk-lo ...

  3. VS2012未找到与约束ContractName...匹配的导出

    用VS2012创建ARCGIS插件项目时,提示“未找到与约束ContractName...匹配的导出”,此前一直都是正常的额 经查,发现是近期系统相关更新导致,解决办法有两种途径: 一是删除近期更新的 ...

  4. Android JNI开发生成.h头文件问题

    在JNI开发中,首先要将建立的anroid类编译成.h文件,编译用到命令javah,由于第一次用,以前对java的编译过程也不怎么了解,所以走了好多弯路,网络没有对这一步的详细介绍,这里讲一下: 通过 ...

  5. Maven进价:使用m2eclipse创建web项目

    1.新建Maven项目 2.设置项目空间 3.选择maven-archetype-webapp 4.填写Maven坐标 Maven坐标:groupId:artifactId:packaging:ver ...

  6. Unity 学习资源

    NGUI文档及视频: http://www.tasharen.com/forum/index.php?topic=6754 动态更新的解决方案: http://game.ceeger.com/foru ...

  7. Direct3D11学习:(九)绘制基本几何体

    转载请注明出处:http://www.cnblogs.com/Ray1024 一.概述 Direct3D中很多复杂的几何效果都是由基本的几何体组合而成的,这篇文章中,我们来学习集中常见的基本几何体的绘 ...

  8. Scrum 项目 7.0

    ------------------7.0------------------------------ Sprint回顾 1.回顾组织 主题:“我们怎样才能在下个sprint中做的更好?” 时间:设定 ...

  9. 重构第22天 分解方法(Break Method)

    理解:如果一个功能,里面比较复杂,代码量比较多,我们就可以把这个功能分解成多个小的method,每个方法实现该功能的一个小小的部分,并且方法命名成容易理解,和方法内容相关的名称,更有助于维护和可读性提 ...

  10. visual studio 局域网远程调试web项目

    1.进入项目根目录,找到.vs/config/applicationhost.config文件(可能是隐藏的) 2.搜索sites节点,找到当前项目,并添加一个binding配置节,将ip地址设置为本 ...