Javascript匿名函数的一种应用 代码封装


Posted in Javascript onJune 27, 2010

在一些Javascript库中可以看见这种写法:

(function(){ 
//所有库代码代码 
})();

说实话,对于js初学者的我来说。这个东西太吓人了,在这些JS库中,这个函数基本上把整个库的所有代码全括起来了,这种写法完全超越了我的常识。难道不应该好好的划分一下吗,难道不应该体现出层次和功能划分吗,怎么会一个函数搞定呢。我一开始完全不敢去细想它的道理。直到使用JS一段时间后,某一天一位同事在闲聊时说起了这个问题,我才知道这个叫匿名函数。匿名函数我并不陌生,C#,Python,Lua中都有这个咚咚。我到网上去查了一下,介绍文章很多,也很详细,但是我心头的疑问却没有得到解决:为什么要这样写。
我找了一款著名的JS开源库JQuery,他的代码就是典型的以上写法,在粗略看了他的代码之后我发现这套代码实在太大了太复杂了,实在不适合我。于是我转而去看另外一个开源js库swfobject,这个库提供了简单的接口把Flash控件嵌入到网页中。这个代码好多了,很短,很快就看完了。看完之后我恍然大悟,原来如此。真理就是如此简单,之所以这样写,只有一个目的:封装。
初学JS的时候,我问过同事,js怎么定义私有函数和变量。当时的得到的答案是:js不是面向对象的,不提供这些功能。我对这个答案也坦然接受了,毕竟严格的封装并不是必要的。现在终于明白了,办法总是有的,在不支持封装的语言里同样可以实现封装。而实现的方法就是匿名函数。来看一段代码:
//定义 
function F(x) 
{ 
this.x = x; 
function double(x){return x*x;} 
this.getDoubleX(){ 
return double(this.x); 
} 
} //使用 
f = new F(12); 
alert(f.getDoubleX());

上面的代码很简单,我没有去运行它。懂点js的都知道这是JS的类定义方式。函数F相当于一个构造函数,而函数里面的其他定义都是函数私有的外部无法访问,例如double函数。这样就变相实现了私有方法。其他打上“this.”前缀的成员相当于公开成员,外部可以访问。
而这些库之所以要用一个大函数包裹整个库代码,就是为了不向使用者暴露内部方法和变量,强制用户只能访问开放的API。从这一点可以开出这些开发者的良苦用心。
到这里我不禁又要问了,js如何实现继承呢。希望这一次的答案不要像上一次一样:不支持。

Javascript 相关文章推荐
基于jquery的获取mouse坐标插件的实现代码
Apr 01 Javascript
javascript基础知识大集锦(一) 推荐收藏
Jan 13 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
Apr 16 Javascript
ASP.NET jQuery 实例15 通过控件CustomValidator验证CheckBoxList
Feb 03 Javascript
jQuery方法简洁实现隔行换色及toggleClass的使用
Mar 15 Javascript
JS实现多物体缓冲运动实例代码
Nov 29 Javascript
使用jQuery重置(reset)表单的方法
May 05 Javascript
JS中完美兼容各大浏览器的scrolltop方法
Apr 17 Javascript
基于javascript制作微博发布栏效果
Apr 04 Javascript
微信小程序商品到详情的实现
Jun 27 Javascript
vue柱状进度条图像的完美实现方案
Aug 26 Javascript
微信小程序自定义导航栏(模板化)
Nov 15 Javascript
ymPrompt的doHandler方法来实现获取子窗口返回值的方法
Jun 25 #Javascript
让IE6支持min-width和max-width的方法
Jun 25 #Javascript
jQuery与其它库冲突的解决方法
Jun 25 #Javascript
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 #Javascript
基于jquery的checkbox下拉框插件代码
Jun 25 #Javascript
jquery keypress,keyup,onpropertychange键盘事件
Jun 25 #Javascript
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 #Javascript
You might like
使用PHP编写发红包程序
2015/07/22 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
div模拟选择框示例代码
2013/11/03 Javascript
jQuery中的jQuery()方法用法分析
2014/12/27 Javascript
jQuery超酷平面式时钟效果代码分享
2020/03/30 Javascript
JavaScript中定义类的方式详解
2016/01/07 Javascript
javascript中的3种继承实现方法
2016/01/27 Javascript
jQuery实现产品对比功能附源码下载
2016/08/09 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
2016/08/10 Javascript
javascript的函数劫持浅析
2016/09/26 Javascript
ajax实现动态下拉框示例
2017/01/10 Javascript
Vue数据驱动模拟实现2
2017/01/11 Javascript
Angular中使用$watch监听object属性值的变化(详解)
2017/04/24 Javascript
详解基于vue的移动web app页面缓存解决方案
2017/08/03 Javascript
vue-resource请求实现http登录拦截或者路由拦截的方法
2018/07/11 Javascript
JS实现将二维数组转为json格式字符串操作示例
2018/07/12 Javascript
element-ui中select组件绑定值改变,触发change事件方法
2018/08/24 Javascript
解决vue 项目引入字体图标报错、不显示等问题
2018/09/01 Javascript
vuedraggable+element ui实现页面控件拖拽排序效果
2020/07/29 Javascript
Python的Flask框架与数据库连接的教程
2015/04/20 Python
简单理解Python中的装饰器
2015/07/31 Python
Windows下Anaconda的安装和简单使用方法
2018/01/04 Python
浅谈Python里面小数点精度的控制
2018/07/16 Python
树莓派极简安装OpenCv的方法步骤
2019/10/10 Python
Python爬虫教程知识点总结
2020/10/19 Python
用纯CSS3实现网页中常见的小箭头
2017/10/16 HTML / CSS
美国爆米花工厂:The Popcorn Factory
2019/09/14 全球购物
我想声明一个指针并为它分配一些空间, 但却不行。这些代码有什么 问题?char *p; *p = malloc(10);
2016/10/06 面试题
信息部岗位职责
2013/11/12 职场文书
班班通项目实施方案
2014/02/25 职场文书
党员创先争优公开承诺书
2014/03/28 职场文书
司法建议书范文
2014/05/13 职场文书
经济贸易系毕业生求职信
2014/05/31 职场文书
校车安全管理责任书
2015/05/11 职场文书
2016年学习雷锋精神广播稿
2015/12/17 职场文书
如何理解Vue简单状态管理之store模式
2021/05/15 Vue.js