JavaScript强化教程——Cocos2d-JS中JavaScript继承
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继承的更多相关文章
- JavaScript强化教程 -- cocosjs场景切换
场景切换 在main.js,将StartScene作为我们初始化运行的场景,代码如下: cc.LoaderScene.preload(g_resources, function () { cc.dir ...
- JavaScript强化教程——jQuery AJAX 实例
什么是 AJAX?AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML).简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据 ...
- JavaScript强化教程 —— Cocos2d-JS的屏幕适配方案
1. 设置屏幕适配策略(Resolution Policy) 如果你还没有用过Resolution Policy,只需要在游戏载入过程完成之后(cc.game.onStart函数回调中),调用下面的代 ...
- JavaScript强化教程 - 六步实现贪食蛇
1.首先创建div 并且给div加样式 <div id="pannel" style="width: 500px;height: 500px;z-index: 1; ...
- JavaScript强化教程——JavaScript 总结
本教程中我们向您讲授了如何向 html 页面添加 JavaScript,使得网站的动态性和交互性更强. 你已经学习了如何创建对事件的响应,验证表单,以及如何根据不同的情况运行不同的脚本. 你也学到了如 ...
- JavaScript强化教程——jQuery UI API 类别
---恢复内容开始--- 主要介绍:JavaScript强化教程—— jQuery UI API 类别 jQuery UI 在jQuery 内置的特效上添加了一些功能.jQuery UI 支持颜色动 ...
- 转:js中javascript:void(0) 真正含义
from:http://www.jb51.net/article/71532.htm 在Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值. 我想使用过ajax的都常 ...
- javascript基础入门之js中的结构分支与循环语句
javascript基础入门之js中的结构分支与循环语句 程序的结构①顺序结构:自上而下:②选择(分支)结构:多条路径,根据不同的条件,只执行其中一个:③循环结构:重复某些代码④配合特定的语句实现选择 ...
- javascript基础入门之js中的数据类型与数据转换01
javascript基础入门之js中的数据结构与数据转换01 js的组成(ECMAScript.BOM.DOM) js中的打印语句: 数据类型 变量 ...
随机推荐
- mongodb备份恢复
注意:在备份文件存放目录的选择上有这样一个条件,文件存放目录不管有多深,都只能有它一个文件:(即除了备份文件之外只能存在文件夹,这个条件约束其整个目录树) 数据备份 : /mongodump --ho ...
- JS中的constructor与prototype
http://www.cnblogs.com/qiantuwuliang/archive/2011/01/08/1930548.html 在学习JS的面向对象过程中,一直对constructor与pr ...
- Android中项目中各个文件夹的含义和用途详解
1.src:存放所有的*.java源程序. 2.gen:为ADT插件自动生成的代码文件保存路径,里面的R.java将保存所有的资源ID. 3.assets:可以存放项目一些较大的资源文件,例如:图片. ...
- MyBatis知多少(7)持久层
持久层是适合使用MyBatis的地方.在面向对象的系统中,持久层主要关注对象(或者更精确地说应该是存储在那些对象中的数据)的存取.在企业应用程序中持久层通常用关系数据库系统来存储数据,虽然某些情况下其 ...
- 2次成功投诉EMS和中国移动的经验
上个月要找房子,搬家很多事情,真实头疼...搬家还把腰闪了....现在还有点痛.然后中间碰到 移动宽带 移机的事情,搞得我非常火.然后想起去年投诉EMS的事情,在事情处理完成后,我果断总结了下来,让大 ...
- android resources使用总结
http://developer.android.com/guide/topics/resources/more-resources.html http://developer.android.com ...
- Android学习笔记之使用百度地图实现Poi搜索
PS:装个系统装了一天.心力憔悴.感觉不会再爱了. 学习内容: 1.使用百度Map实现Poi搜索. 2.短串分享 3.在线建议查询 百度地图的研究也算是过半了.能够实现定位,实现相关信息的搜索,实 ...
- SQL Server技术问题之触发器优缺点
优点: 1.强化约束:强制复杂业务的规则和要求,能实现比check语句更为复杂的约束. 2.跟踪变化:触发器可以侦测数据库内的操作,从而禁止数据库中未经许可的更新和变化. 3.级联运行:侦测数据库内的 ...
- JS魔法堂:属性、特性,傻傻分不清楚
一.前言 或许你和我一样都曾经被下面的代码所困扰 var el = document.getElementById('dummy'); el.hello = "test"; con ...
- mysql update时报错You are using safe update mode
在使用mysql执行update的时候,如果不是用主键当where语句,会报如下错误,使用主键用于where语句中正常. ) Error Code: . You are using safe upda ...