javascript 写类方式之十


Posted in Javascript onJuly 05, 2009

10、mootools.js的写类方式
mootools.js的最新版本是1.2.3,这里使用的是1.2.0。mootool被设计成非常紧凑的,模块化的,面向对象的的js库。mootool中写类用Class类。Class类由Native类new出来的:

/* 
*Script: Class.js 
*/ 
var Class = new Native({ 
name: 'Class', initialize: function(properties){ 
properties = properties || {}; 
var klass = function(empty){ 
for (var key in this) this[key] = $unlink(this[key]); 
for (var mutator in Class.Mutators){ 
if (!this[mutator]) continue; 
Class.Mutators[mutator](this, this[mutator]); 
delete this[mutator]; 
} 
this.constructor = klass; 
if (empty === $empty) return this; 
var self = (this.initialize) ? this.initialize.apply(this, arguments) : this; 
if (this.options && this.options.initialize) this.options.initialize.call(this); 
return self; 
}; 
$extend(klass, this); 
klass.constructor = Class; 
klass.prototype = properties; 
return klass; 
} 
});

Native方法是mootools中一个非常重要的方法,很多类都用它去组装。如Window,Document,Event。当然还有这里的Class,导入mootools后我们写类时只需要用Class就行了。一个Person类:
/** 
* Person类 
* @param {Object} name 
*/ 
var Person = new Class({ 
initialize: function(name){ 
this.name = name; 
}, 
setName : function(name) { 
this.name = name; 
}, 
getName : function() { 
return this.name; 
} 
}) //new一个对象 
var p = new Person("jack"); 
//测试set,get方法 
console.log(p.getName());//jac 
p.setName('andy'); 
console.log(p.getName());//andy 
//测试instanceof及p.constructor是否正确指向了Person 
console.log(p instanceof Person); //true 
console.log(p.constructor == Person); //true

Native实际上只是一个普通函数,它通过所传参数组装了一个类(function),最后返回该类(function)。既然Native是函数,函数调用的方式是(),call,apply。但在mootools中却用new Native(obj)方式。为何?原因只是使Native看起来更像一个类而已。
Javascript 相关文章推荐
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
Dec 07 Javascript
JavaScript中获取未知对象属性的代码
Apr 27 Javascript
javaScript实现浮点数转十六进制字符
Oct 29 Javascript
给文字加上着重号的JS代码
Nov 12 Javascript
jquery动态调整div大小使其宽度始终为浏览器宽度
Jun 06 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
Oct 07 Javascript
基于jquery ui的alert,confirm方案(支持换肤)
Apr 03 Javascript
jquery实现倒计时功能
Dec 28 Javascript
利用浮层使select不可选的实现方法
Dec 03 Javascript
bootstrapValidator表单验证插件学习
Dec 30 Javascript
Vue+mui实现图片的本地缓存示例代码
May 24 Javascript
详解Vue中watch对象内属性的方法
Feb 01 Javascript
javascript 写类方式之九
Jul 05 #Javascript
javascript 写类方式之八
Jul 05 #Javascript
javascript 写类方式之七
Jul 05 #Javascript
javascript 写类方式之六
Jul 05 #Javascript
javascript 写类方式之五
Jul 05 #Javascript
javascript 写类方式之四
Jul 05 #Javascript
javascript 写类方式之三
Jul 05 #Javascript
You might like
php网上商城购物车设计代码分享
2012/02/15 PHP
php中JSON的使用与转换
2015/01/14 PHP
微信access_token的获取开发示例
2015/04/16 PHP
php实现的双色球算法示例
2017/06/20 PHP
PHP PDOStatement::errorInfo讲解
2019/01/31 PHP
关于文本限制字数的js代码
2007/04/02 Javascript
javascript 特殊字符串
2009/02/25 Javascript
Javascript设置对象的ReadOnly属性(示例代码)
2013/12/25 Javascript
在Node.js中使用HTTP上传文件的方法
2015/06/23 Javascript
jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法
2015/11/23 Javascript
jquery实现一个简单的表单验证实例
2016/03/30 Javascript
Vue指令的钩子函数使用方法
2017/03/20 Javascript
js 去掉字符串前后空格实现代码集合
2017/03/25 Javascript
vue 2.0组件与v-model详解
2017/03/27 Javascript
js原生代码实现轮播图的实例讲解
2017/07/28 Javascript
JavaScript使用localStorage存储数据
2019/09/25 Javascript
vue和iview实现Scroll 数据无限滚动功能
2019/10/31 Javascript
js模拟实现百度搜索
2020/06/28 Javascript
vue点击标签切换选中及互相排斥操作
2020/07/17 Javascript
[03:56]还原FTP电影首映式 DOTA2群星拼出遗迹世界
2014/03/26 DOTA
零基础写python爬虫之神器正则表达式
2014/11/06 Python
Python使用OpenCV进行标定
2018/05/08 Python
Python完全识别验证码自动登录实例详解
2019/11/24 Python
Python操作多维数组输出和矩阵运算示例
2019/11/28 Python
新手学python应该下哪个版本
2020/06/11 Python
Python爬虫爬取微博热搜保存为 Markdown 文件的源码
2021/02/22 Python
python matplotlib工具栏源码探析三之添加、删除自定义工具项的案例详解
2021/02/25 Python
FORZIERI澳大利亚站:全球顶级奢华配饰精品店
2016/12/31 全球购物
abstract是什么意思
2012/02/12 面试题
博士生入学考试推荐信
2013/11/17 职场文书
中药学专业毕业生推荐信
2014/07/10 职场文书
2015年社会实践个人总结
2015/03/06 职场文书
消防安全主题班会
2015/08/12 职场文书
2016年第32个教师节致辞
2015/11/26 职场文书
2016年五一促销广告语
2016/01/28 职场文书
德劲DE1105机评
2022/04/05 无线电