jQuery中(function($){})(jQuery)详解


Posted in Javascript onJuly 15, 2015

简单的说

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

声明了一个匿名函数,也就是将jQuery对象作为参数传给函数

给大家举个例子

// 全局
var str = "全局字符串...";
(function () { // 第1层
  (function () { // 第2层
    (function () { // 第3层
      (function () { // 第4层 层数越多,访问全局越慢
        console.time('全局');
        for (var i=0; i<1e6; i++) {
          str += Math.random().toString().substr(2, 2);
        }
        console.timeEnd('全局');
      })();
    })();
  })();
})();
 
// 局部
(function () { // 第1层
  (function () { // 第2层
    (function () { // 第3层
      (function () { // 第4层
        var str = "内部字符串...";
        var random = Math.random;
        console.time('内部');
        for (var i=0; i<1e6; i++) {
          str += random().toString().substr(2, 2);
        }
        console.timeEnd('内部');
      })();
    })()
  })();
})();

运行代码 就可以看到效果了,比较慢,骚等片刻。
我刚刚测试发现一些内存小的电脑容易直接导致浏览器崩溃、
chrome武装到牙齿了,连字符串都缓存,看不出多大效果、

和速度应该没关系,我是这么认为的。

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

jQuery插件众多,你无法确定自己使用的变量或者方法名不于其他插件重名,所以需要将所有插件代码封装到一个匿名函数当中;

由于插件使用了jQuery所以需要导入jQuery到匿名函数中,同时使用$变量引用(因为大家已经习惯了使用$)。当然你在全局下也可以使用$,但是无法完成第一个条件;
封装的代码必须执行,所以要执行匿名函数同时传入jQuery参数。

总结

其实是为了保护$符号,不管外界是否引入了另外有干扰$的库,都不会干扰匿名函数中$就是jQuery的事实,因为他是作为参数被传进去的。

Javascript 相关文章推荐
拖动Html元素集合 Drag and Drop any item
Dec 22 Javascript
jquery实现红色竖向多级向右展开的导航菜单效果
Aug 31 Javascript
高效Web开发的10个jQuery代码片段
Jul 22 Javascript
jQuery实现的自动加载页面功能示例
Sep 04 Javascript
JS实现点击表头表格自动排序(含数字、字符串、日期)
Jan 22 Javascript
JS实现瀑布流布局
Oct 21 Javascript
详解HTML5 使用video标签实现选择摄像头功能
Oct 25 Javascript
解决VUEX兼容IE上的报错问题
Mar 01 Javascript
解决layui富文本编辑器图片上传无法回显的问题
Sep 18 Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 Javascript
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
基于小程序请求接口wx.request封装的类axios请求
Jul 02 Javascript
jQuery的事件委托实例分析
Jul 15 #Javascript
jQuery的end()方法使用详解
Jul 15 #Javascript
浅谈$(document)和$(window)的区别
Jul 15 #Javascript
浅谈window对象的scrollBy()方法
Jul 15 #Javascript
jQuery的bind()方法使用详解
Jul 15 #Javascript
纯JavaScript实现的分页插件实例
Jul 14 #Javascript
javascript实现网页字符定位的方法
Jul 14 #Javascript
You might like
遍历指定目录下的所有目录和文件的php代码
2011/11/27 PHP
Apache中php.ini的设置方法
2013/02/28 PHP
linux系统下php安装mbstring扩展的二种方法
2014/01/20 PHP
ThinkPHP应用模式扩展详解
2014/07/16 PHP
在Z-Blog中运行代码[html][/html](纯JS版)
2007/03/25 Javascript
js的hasownproperty使用示例
2014/03/02 Javascript
javascript中为某个元素指定事件的三种方式
2014/08/07 Javascript
推荐4个原生javascript常用的函数
2015/01/12 Javascript
JS实现让网页背景图片斜向移动的方法
2015/02/25 Javascript
JavaScript获取当前网页最后修改时间的方法
2015/04/03 Javascript
Javascript实现图片加载从模糊到清晰显示的方法
2016/06/21 Javascript
js中通过getElementsByName访问name集合对象的方法
2016/10/31 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
JS实现前端页面的搜索功能
2018/06/12 Javascript
Vue中android4.4不兼容问题的解决方法
2018/09/04 Javascript
微信小程序实现选项卡效果
2018/11/06 Javascript
vue el-table实现自定义表头
2019/12/11 Javascript
在python的WEB框架Flask中使用多个配置文件的解决方法
2014/04/18 Python
用Python实现通过哈希算法检测图片重复的教程
2015/04/02 Python
Python实现Sqlite将字段当做索引进行查询的方法
2016/07/21 Python
关于python的bottle框架跨域请求报错问题的处理方法
2017/03/19 Python
Mac 上切换Python多版本
2017/06/17 Python
Python中列表list以及list与数组array的相互转换实现方法
2017/09/22 Python
Python 把序列转换为元组的函数tuple方法
2019/06/27 Python
Python面向对象之Web静态服务器
2019/09/03 Python
基于HTML5的齿轮动画特效
2016/02/29 HTML / CSS
装饰活动策划方案
2014/02/11 职场文书
幼儿园中秋节活动反思
2014/02/16 职场文书
酒店管理求职信范文
2014/04/06 职场文书
最新优秀教师个人先进事迹材料
2014/05/06 职场文书
2016应届毕业生实习评语
2015/12/01 职场文书
《比尾巴》教学反思
2016/02/24 职场文书
2019大学生社会实践报告汇总
2019/08/16 职场文书
Python办公自动化之Excel(中)
2021/05/24 Python
JavaScript 与 TypeScript之间的联系
2021/11/27 Javascript
Python序列化模块JSON与Pickle
2022/06/05 Python