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 相关文章推荐
彪哥1.1(智能表格)提供下载
Sep 07 Javascript
XP折叠菜单&仿QQ2006菜单
Dec 16 Javascript
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
Feb 23 Javascript
ASP Json Parser修正版
Dec 06 Javascript
JS去除数组重复值的五种不同方法
Sep 06 Javascript
jQuery中children()方法用法实例
Jan 07 Javascript
JavaScript中的DSL元编程介绍
Mar 15 Javascript
jquery实现的省市区三级联动
Apr 02 Javascript
Javascript 正则表达式校验数字的简单实例
Nov 02 Javascript
vuejs响应用户事件(如点击事件)
Mar 14 Javascript
JavaScript使用ul中li标签实现删除效果
Apr 15 Javascript
用Vue编写抽象组件的方法
May 06 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
?生?D片??C字串
2006/12/06 PHP
基于在生产环境中使用php性能测试工具xhprof的详解
2013/06/03 PHP
在Yii框架中使用PHP模板引擎Twig的例子
2014/06/13 PHP
php替换字符串中间字符为省略号的方法
2015/05/04 PHP
php中 ob_start等函数截取标准输出的方法
2015/06/22 PHP
php字符串操作针对负值的判断分析
2016/07/28 PHP
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
extjs 04_grid 单击事件新发现
2012/11/27 Javascript
elemetUi 组件--el-upload实现上传Excel文件的实例
2017/10/27 Javascript
Vue2.0 实现单选互斥的方法
2018/04/13 Javascript
AngularJS 前台分页实现的示例代码
2018/06/07 Javascript
详解如何使用webpack打包JS
2018/06/21 Javascript
NodeJS 将文件夹按照存放路径变成一个对应的JSON的方法
2018/10/17 NodeJs
jQuery实现的隔行变色功能【案例】
2019/02/18 jQuery
Nodejs对postgresql基本操作的封装方法
2019/02/20 NodeJs
基于elementUI实现图片预览组件的示例代码
2019/03/31 Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
2020/03/09 Javascript
vue cli 3.0通用打包配置代码,不分一二级目录
2020/09/02 Javascript
[06:36]吞吞映像top1
2014/06/20 DOTA
[26:21]浴火之凤-TI4世界冠军Newbee战队纪录片
2014/08/07 DOTA
python中文乱码的解决方法
2013/11/04 Python
Python通过递归遍历出集合中所有元素的方法
2015/02/25 Python
通过python改变图片特定区域的颜色详解
2019/07/15 Python
Python各种扩展名区别点整理
2020/02/27 Python
详解python定时简单爬取网页新闻存入数据库并发送邮件
2020/11/27 Python
html5中的input新属性range使用记录
2014/09/05 HTML / CSS
法国家具及室内配件店:home24
2017/01/21 全球购物
美国汽车轮胎和轮毂销售网站:Tire Rack
2018/01/11 全球购物
BookOutlet加拿大:在网上书店购买廉价折扣图书和小说
2018/10/05 全球购物
Clos19英国:高档香槟、葡萄酒和烈酒在线购物平台
2020/07/10 全球购物
实习鉴定范文
2013/12/19 职场文书
初中生物教学反思
2014/01/10 职场文书
差生评语大全
2014/05/04 职场文书
签约仪式策划方案
2014/06/02 职场文书
2014坚持党风廉政建设思想汇报
2014/09/18 职场文书
机关干部作风整顿心得体会
2016/01/22 职场文书