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 相关文章推荐
javascript权威指南 学习笔记之null和undefined
Sep 25 Javascript
JQuery实现点击div以外的位置隐藏该div窗口
Sep 13 Javascript
js获取对象为null的解决方法
Nov 21 Javascript
利用JS来控制键盘的上下左右键(示例代码)
Dec 14 Javascript
邮箱下拉自动填充选择示例代码附图
Apr 03 Javascript
JavaScript Date 知识浅析
Jan 29 Javascript
Vue-cli创建项目从单页面到多页面的方法
Sep 20 Javascript
基于jQuery实现定位导航位置效果
Nov 15 jQuery
js时间转换毫秒的实例代码
Aug 21 Javascript
layui原生表单验证的实例
Sep 09 Javascript
JS实现贪吃蛇游戏
Nov 15 Javascript
vue.js this.$router.push获取不到params参数问题
Mar 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 最大运行时间 max_execution_time修改方法
2010/03/08 PHP
PHP实现对png图像进行缩放的方法(支持透明背景)
2015/07/15 PHP
PHP模拟asp.net的StringBuilder类实现方法
2015/08/08 PHP
PHP实时统计中文字数和区别
2019/02/28 PHP
javascript之函数直接量(function(){})()
2007/06/29 Javascript
JavaScript开发时的五个注意事项
2007/12/08 Javascript
Javascript 的addEventListener()及attachEvent()区别分析
2009/05/21 Javascript
json原理分析及实例介绍
2012/11/29 Javascript
JS画5角星方法介绍
2013/09/17 Javascript
jquery如何判断某元素是否具备指定的样式
2013/11/05 Javascript
JQuery对表单元素的基本操作使用总结
2014/07/18 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
JavaScript实现的简单拖拽效果
2015/06/01 Javascript
使用jquery如何获取时间
2016/10/13 Javascript
webpack4.0打包优化策略整理小结
2018/03/30 Javascript
小程序分享链接onShareAppMessage的具体用法
2020/05/22 Javascript
详解Vue中的自定义指令
2020/12/07 Vue.js
用ReactJS和Python的Flask框架编写留言板的代码示例
2015/12/19 Python
使用python爬虫实现网络股票信息爬取的demo
2018/01/05 Python
Python Tkinter实现简易计算器功能
2018/01/30 Python
Python实现修改IE注册表功能示例
2018/05/10 Python
解决python3.5 正常安装 却不能直接使用Tkinter包的问题
2019/02/22 Python
python数据预处理方式 :数据降维
2020/02/24 Python
python+adb+monkey实现Rom稳定性测试详解
2020/04/23 Python
Python3如何使用多线程升程序运行速度
2020/08/11 Python
Python使用struct处理二进制(pack和unpack用法)
2020/11/12 Python
使用HTML5的Notification API制作web通知的教程
2015/05/08 HTML / CSS
英国最大的宠物食品和宠物用品网上零售商: Zooplus
2016/08/01 全球购物
你们项目是如何进行变更控制的
2015/08/26 面试题
应届生的求职推荐信范文
2013/11/30 职场文书
采购主管岗位职责
2014/02/01 职场文书
2015年老干部工作总结
2015/04/23 职场文书
社区法制宣传日活动总结
2015/05/05 职场文书
志愿者服务宣传标语口号
2015/12/26 职场文书
Python中itertools库的四个函数介绍
2022/04/06 Python
《火纹风花雪月无双》预告“神秘雇佣兵” 紫发剑客
2022/04/13 其他游戏