jQuery创建插件的代码分析


Posted in Javascript onApril 14, 2011

创建jQuery插件,基本的格式是上面这段代码:

(function ($) 
{ 
//add code here 
})(jQuery)

我们怎么理解?
第一步:function ($){}定义了一个匿名的函数,有一个参数,$是参数名,和其他的参数名没什么区别。
第二步:(function ($){})(jQuery)
我们要执行一个匿名函数的时候,通常用var func = function ($) { },然后func(参数)这样的形式。这里func就是一个Function对象。但更简洁的(function ($) {}),这时用括号,也同样返回括号的内容,也是一个function对象。我们再执行就可以了:(function ($) {})(jQuery)
第三步:这时我们实际上是执行上面定义的匿名函数,执行的时候为该匿名函数提供一个参数值:jQuery。
第四步:所以最终上面的表达等价于:
var func = function($) { };
func(jQuery);
即定义匿名函数,并以jQuery为参数执行一次。

这里的作用是什么呢?
1、解决$符号冲突问题
jQuery中我们用$来代替jQuery,这是为了简化写法。但$这个符号有时候会冲突。
在上面匿名函数的代码中,我们可以习惯性的用$来写,但执行的时候会用jQuery来代替,这就避免了变量的冲突。
2、解决闭包问题:
一般直接写在脚本里的函数,执行后其中未销毁的变量是继续存在,并能够正常访问的。这个和我们一向理解的函数私有变量是不符的。
但我们用这种方式,将需要的所有函数都包在这个匿名函数里,则其中的局部变量,在外部将不能访问,变相的起到了创建私有的局部变量的作用。只有this.开头的那些成员,才是插件外部可以访问的。

Javascript 相关文章推荐
采用CSS和JS,刚好我最近有个站点要用到下拉菜单!
Jun 26 Javascript
Javascript实现视频轮播在pc端与移动端均可
Sep 29 Javascript
tangram框架响应式加载图片方法
Nov 21 Javascript
纯JavaScript实现的兼容各浏览器的添加和移除事件封装
Mar 28 Javascript
javascript编程异常处理实例小结
Nov 30 Javascript
jQuery ajax分页插件实例代码
Jan 27 Javascript
javascript实现在网页中运行本地程序的方法
Feb 03 Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
Mar 29 Javascript
angularjs过滤器--filter与ng-repeat配合有奇效
Apr 20 Javascript
ES6中的Promise代码详解
Oct 09 Javascript
Vue作用域插槽slot-scope实例代码
Sep 05 Javascript
微信小程序实现页面下拉刷新和上拉加载功能详解
Dec 03 Javascript
Jquery公告滚动+AJAX后台得到数据
Apr 14 #Javascript
jquery中eq和get的区别与使用方法
Apr 14 #Javascript
基于jquery的blockui插件显示弹出层
Apr 14 #Javascript
强大的jquery插件jqeuryUI做网页对话框效果!简单
Apr 14 #Javascript
让textarea自动调整大小的js代码
Apr 12 #Javascript
javascript算法学习(直接插入排序)
Apr 12 #Javascript
jQuery实战之仿淘宝商城左侧导航效果
Apr 12 #Javascript
You might like
php的一个登录的类 [推荐]
2007/03/16 PHP
单一index.php实现PHP任意层级文件夹遍历(Zjmainstay原创)
2012/07/31 PHP
基于php socket(fsockopen)的应用实例分析
2013/06/02 PHP
PHP 验证码不显示只有一个小红叉的解决方法
2013/09/30 PHP
javascript中对对层的控制
2006/12/29 Javascript
JQuery 技巧和窍门整理(8个)
2010/04/22 Javascript
JS显示下拉列表框内全部元素的方法
2015/03/31 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
2015/06/25 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
2016/08/01 Javascript
详解Nodejs的timers模块
2016/12/22 NodeJs
JS异步文件分片断点上传的实现思路
2016/12/25 Javascript
Angular Renderer (渲染器)的具体使用
2018/05/03 Javascript
JS验证输入的是否是数字及保留几位小数问题
2018/05/09 Javascript
浅谈react性能优化的方法
2018/09/05 Javascript
layer弹出子iframe层父子页面传值的实现方法
2018/11/22 Javascript
javascript实现弹出层效果
2019/12/10 Javascript
原生js+canvas实现贪吃蛇效果
2020/08/02 Javascript
Python实现端口复用实例代码
2014/07/03 Python
python使用Pandas库提升项目的运行速度过程详解
2019/07/12 Python
python 实现按对象传值
2019/12/26 Python
python集合删除多种方法详解
2020/02/10 Python
Python使用urllib模块对URL网址中的中文编码与解码实例详解
2020/02/18 Python
css3 column实现卡片瀑布流布局的示例代码
2018/06/22 HTML / CSS
html5 Canvas画图教程(2)—画直线与设置线条的样式如颜色/端点/交汇点
2013/01/09 HTML / CSS
HTML5地理定位实例
2014/10/15 HTML / CSS
检测浏览器对HTML5和CSS3支持度的方法
2015/06/25 HTML / CSS
Html5 Canvas实现图片标记、缩放、移动和保存历史状态功能 (附转换公式)
2020/03/18 HTML / CSS
美国最好的钓鱼、狩猎和划船装备商店:Bass Pro Shops
2018/12/02 全球购物
客服实习的个人自我鉴定
2013/10/20 职场文书
资助贫困学生倡议书
2014/05/16 职场文书
七一建党日演讲稿
2014/09/05 职场文书
市场营销计划书范文
2015/01/16 职场文书
优秀团员个人总结
2015/02/26 职场文书
欧也妮葛朗台读书笔记
2015/06/30 职场文书
Python中Permission denied的解决方案
2021/04/02 Python
Python测试框架pytest高阶用法全面详解
2022/06/01 Python