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 相关文章推荐
在视频前插入广告
Nov 20 Javascript
Javascript里使用Dom操作Xml
Jan 22 Javascript
学习js在线html(富文本,所见即所得)编辑器
Dec 18 Javascript
jquery制作弹窗提示窗口代码分享
Mar 02 Javascript
js闭包的用途详解
Nov 09 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
Ionic+AngularJS实现登录和注册带验证功能
Feb 09 Javascript
详解如何构建Angular项目目录结构
Jul 13 Javascript
前端图片懒加载(lazyload)的实现方法(提高用户体验)
Aug 21 Javascript
python实现迭代法求方程组的根过程解析
Nov 25 Javascript
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
Mar 17 Javascript
解决vue项目打包上服务器显示404错误,本地没出错的问题
Nov 03 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 判断数组是几维数组
2013/03/20 PHP
解析php DOMElement 操作xml 文档的实现代码
2013/05/10 PHP
php中数字0和空值的区别分析
2014/06/05 PHP
php+mysql删除指定编号员工信息的方法
2015/01/14 PHP
Laravel 5 框架入门(二)构建 Pages 的管理功能
2015/04/09 PHP
关于扩展 Laravel 默认 Session 中间件导致的 Session 写入失效问题分析
2016/01/08 PHP
php基于自定义函数记录log日志方法
2017/07/21 PHP
laravel5表单唯一验证的实例代码
2019/09/30 PHP
phpinfo的知识点总结
2019/10/10 PHP
JS高级笔记
2011/07/13 Javascript
验证控件与Button的OnClientClick事件详细解析
2013/12/04 Javascript
js控制容器隐藏出现防止样式变化的两种方法
2014/04/25 Javascript
IE下通过a实现location.href 获取referer的值
2014/09/04 Javascript
RequireJS入门一之实现第一个例子
2015/09/30 Javascript
关于数据与后端进行交流匹配(点亮星星)
2016/08/03 Javascript
详解vue.js组件化开发实践
2016/12/14 Javascript
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
2018/04/03 Javascript
Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖
2018/11/25 Javascript
Object.keys() 和 Object.getOwnPropertyNames() 的区别详解
2020/05/21 Javascript
如何在postman中添加cookie信息步骤解析
2020/06/30 Javascript
Python3中的真除和Floor除法用法分析
2016/03/16 Python
python实现定时自动备份文件到其他主机的实例代码
2018/02/23 Python
python selenium 获取标签的属性值、内容、状态方法
2018/06/22 Python
python Tensor和Array对比分析
2020/01/08 Python
python selenium 获取接口数据的实现
2020/12/07 Python
什么是WEB控件?使用WEB控件有哪些优势?
2012/01/21 面试题
Java的类可以定义为Protected或者Private得吗
2015/09/25 面试题
临床医学专业个人的自我评价
2013/09/27 职场文书
进修护士自我鉴定
2013/10/14 职场文书
党在我心中的演讲稿
2014/09/13 职场文书
学校运动会广播稿范文
2014/10/02 职场文书
紧急通知
2015/04/17 职场文书
医院员工辞职信范文
2015/05/12 职场文书
为什么阅读对所有年龄段的孩子都很重要?
2019/07/08 职场文书
穷人该怎么创业?谨记以下几点
2019/07/11 职场文书
springboot集成redis存对象乱码的问题及解决
2022/06/16 Java/Android