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 相关文章推荐
javascript学习笔记(一) 在html中使用javascript
Jun 18 Javascript
jQuery关键词说明插件cluetip使用指南
Apr 21 Javascript
AngularJs  Creating Services详解及示例代码
Sep 02 Javascript
JS常见简单正则表达式验证功能小结【手机,地址,企业税号,金额,身份证等】
Jan 22 Javascript
Vue监听数组变化源码解析
Mar 09 Javascript
不得不看之JavaScript构造函数及new运算符
Aug 21 Javascript
使用nvm管理不同版本的node与npm的方法
Oct 31 Javascript
JS实现字符串中去除指定子字符串方法分析
May 17 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 jQuery
如何在基于vue-cli的项目自定义打包环境
Nov 10 Javascript
vue-router重定向和路由别名的使用讲解
Jan 19 Javascript
浅谈vue权限管理实现及流程
Apr 23 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
Codeigniter的dom类用法实例
2015/06/26 PHP
php上传大文件失败的原因及应对策略
2015/10/20 PHP
PHP中__set()实例用法和基础讲解
2019/07/23 PHP
几个常用的JavaScript字符串处理函数 - split()、join()、substring()和indexOf()
2009/06/02 Javascript
jQuery 使用手册(五)
2009/09/23 Javascript
Jquery 实现表格颜色交替变化鼠标移过颜色变化实例
2013/08/28 Javascript
判断JS对象是否拥有某种属性的两种方式
2013/12/02 Javascript
jquery单行文字向上滚动效果示例
2014/03/06 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
2015/07/27 Javascript
JavaScript中windows.open()、windows.close()方法详解
2016/07/28 Javascript
浅谈JS之iframe中的窗口
2016/09/13 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
js实现常见的工具条效果
2017/03/02 Javascript
jQuery条件分页 代替离线查询(附代码)
2017/08/17 jQuery
用vue构建多页面应用的示例代码
2017/09/20 Javascript
mui框架 页面无法滚动的解决方法(推荐)
2018/01/25 Javascript
async/await地狱该如何避免详解
2018/05/10 Javascript
vue删除html内容的标签样式实例
2018/09/13 Javascript
layuiAdmin循环遍历展示商品图片列表的方法
2019/09/16 Javascript
jQuery实现移动端图片上传预览组件的方法分析
2020/05/01 jQuery
详解JSON.stringify()的5个秘密特性
2020/05/26 Javascript
JavaScript图片旋转效果实现方法详解
2020/06/28 Javascript
Vue基于localStorage存储信息代码实例
2020/11/16 Javascript
Python交互式图形编程的实现
2019/07/25 Python
Python中Unittest框架的具体使用
2019/08/27 Python
Django获取应用下的所有models的例子
2019/08/30 Python
Python Celery多队列配置代码实例
2019/11/22 Python
python 错误处理 assert详解
2020/04/20 Python
Ubuntu权限不足无法创建文件夹解决方案
2020/11/14 Python
伦敦所有西区剧院演出官方票务代理:Theatre Tickets Direct
2017/05/26 全球购物
香蕉共和国加拿大官网:Banana Republic加拿大
2018/08/06 全球购物
数据库的约束含义
2012/09/09 面试题
一些高难度的SQL面试题
2016/11/29 面试题
2015年党员公开承诺事项
2015/04/27 职场文书
公司的力量观后感
2015/06/05 职场文书
新闻发布会新闻稿
2015/07/17 职场文书