在Bootstrap源码(具体请看《Bootstrap源码解析1》)和其他jQuery插件经常看到如下的写法:

+function ($) {   

}(window.jQuery); 

这种写法称为:IIFE 2(Imdiately InvokedFunction Expression 立即执行的函数表达式)。

解析:

先弄清函数表达式(function expression)和 函数声明(function declaration)的区别:

函数表达式  var test = function() {};

函数声明     function test() {};

* 函数表达式 中的函数可以为匿名函数,也可以有函数名,但是该函数实际上不能直接使用,只能通过表达式左边的变量 test 来调用。

函数声明 时必须有函数名。

  匿名函数通过一元操作符+变成了函数表达式。也可以使用 - ~ !等其他一元运算符或者括号,目的是为了引导解析器,指明运算符附近是一个表达式。

  函数表达式通过 末尾的() 来调用并运行。就是一个IIFE。

  * 传参,为了避免$与其他库或者模板申明冲突,window.jQuery 作为参数传递。

  * 各种符号性能对比4结果:

   

  由图可见+性能最差(在Firefox下差距更明显),其他几种都差不多。不过IIFE只执行一遍,对js执行效率的影响特别小,使用哪种还是看个人爱好。

Other:


  01. jQuery优化

一段看上去写法有点像的代码。大部分项目用这段代码做作用域,这段代码会在DOM加载完成时初始化jQuery代码。

$(function(){   

}); 

  这种写法等同于

$(document).ready(function(){
// 在DOM加载完成时初始化jQuery代码。
});

  区别于  

$(window).load(function(){
// 在图片等媒体文件加载完成时,初始化jQuery代码。
});

  结合IIFE的最佳实践,更好的写法是,立即执行document ready

+function ($) {
$(function(){ })
}(window.jQuery)

  02. 在Bootstrap和其他插件中经常看到如下写法:

+function ($) {
"use strict"; }(window.jQuery);

  关于字符串"use strict";请看严格模式 5

参考出处:http://suqing.iteye.com/blog/1981591

笔记:IIFE 立即执行的函数表达式 +function ($) { }(window.jQuery);的更多相关文章

  1. [javascript]IIFE立即执行的函数表达式

    近况:最近一直忙着找实习没有更新,不过学习还是在继续的.最近在写Node.js又稍带把javascript的角落知识捡了一遍,过半个月打算去看看python和一些CSS深层的书和博客.工作找的还好,拿 ...

  2. IIFE 立即执行的函数表达式

    介绍IIFE IIFE的性能 使用IIFE的好处 IIFE最佳实践 jQuery优化 在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的 ...

  3. JS---------IIFE(Imdiately Invoked Function Expression 立即执行的函数表达式)

    +function($){}(jQuery); 今天看到js代码里面有这个格式的代码,不知道啥意思,就去查了一下,我也是js小白.首先前面的+号,这个不是固定非要写+号,只要写一级运算符都可以.目的是 ...

  4. JavaScript:立即执行的函数表达式

    先要理解清楚几个概念:   以下转自:http://www.cnblogs.com/TomXu/archive/2011/12/31/2289423.html  问题的核心 当你声明类似functio ...

  5. <深入理解JavaScript>学习笔记(2)_揭秘命名函数表达式

    写在前面的话 注:本文是拜读了 深入理解JavaScript 之后深有感悟,故做次笔记方便之后查看. 感觉这章的内容有点深奥....略难懂啊. 先坐下笔记,加深一下印象吧. 我主要记一下自己感觉有用的 ...

  6. JS 立即执行的函数表达式(function)写法

    1. 正确的写法 对于JavaScript 来说,括弧()里面不能包含语句,所以在这一点上,解析器在解析function关键字的时候,会将相应的代码解析成function表达式,而不是function ...

  7. JS学习笔记3_函数表达式

    1.函数表达式与函数声明的区别 函数声明有“提升”(hoisting)的特性,而函数表达式没有.也就是说,函数声明会在加载代码时被预先加载到context中,而函数表达式只有在执行表达式语句时才会被加 ...

  8. 立即执行函数表达式(IIFE)

    原文地址:benalman.com/news/2010/11/immediately-invoked-function-expression/ 译者:nzbin 也许你还没有注意到,我是一个对术语比较 ...

  9. javascript模块化编程-详解立即执行函数表达式IIFE

    一.IIFE解释 全拼Imdiately Invoked Function Expression,立即执行的函数表达式.  像如下的代码所示,就是一个匿名立即执行函数: (function(windo ...

随机推荐

  1. win下apache的error.log和access.log文件过大

    在httpd.conf中修改ErrorLog和CustomLog的配置 ErrorLog "|E:/apache2.2/bin/rotatelogs.exe E:/apache2.2/log ...

  2. Hadoop集群配置(最全面总结 )(转)

    Hadoop集群配置(最全面总结) huangguisu 通常,集群里的一台机器被指定为 NameNode,另一台不同的机器被指定为JobTracker.这些机器是masters.余下的机器即作为Da ...

  3. dev NavBarControl控件

    一.新建一个导航栏 拖入一个panel到窗口上做为导航栏的容器,然后再拖入一个NavBarControl到其上,点击NavBarControl控件的右上角三角箭头展开任务列表,选择PaintStyle ...

  4. js 逻辑运算符

    两个逻辑运算符的操作顺序在自己的脑海里一直理不清,用js做了个实验 <script type="text/javascript">    if(false && ...

  5. ui设计学习路线图分享送给初学者

    本文来源:千锋UI设计 Ui设计师就业市场前景及薪资很可观,而且现在市场上对于ui设计师的人才需求也很大,所以,现在越来越多的人看好这一行业,纷纷投入到ui设计的学习中来,那么想新手想要学好ui设计, ...

  6. 电商类web原型制作分享——美丽说【附源文件】

    美丽说是国内白领女性时尚消费品牌,精选上千家优质卖家供应商,为用户提供女装.女鞋.女包.配饰.美妆等品类的优质时尚商品. 此原型模板所用到的组件有搜索框.下拉菜单.输入框.选项卡等.交互动作有切换选项 ...

  7. UI设计初学者必看,这款设计神器教你快速入门

    网络时代,网页和手机App已经深入到人们生活的方方面面.这也使得App界面设计越来越受青年求职者们的青睐,并纷纷投入这个行业.但是,作为UI设计初学者,究竟如何才能快速的入门?当今市场上,是否有那么一 ...

  8. cocos js 3.8.1 clippingNode 不能被 ccui.ScrollView 或者ccui.Layout裁剪的bug

    clippingNode不能被ccui.ScrollView.ccui.ListView.ccui.Layout裁剪问题,只需要 设置scrollView ...的裁剪类型 scrollView.se ...

  9. 如何使用Log4j

    如何使用Log4j? 1. Log4j是什么?   Log4j可以帮助调试(有时候debug是发挥不了作 用的)和分析,要下载和了解更详细的内容,还是访问其官方网站吧: http://jakarta. ...

  10. @Transactional注解使用心得

    配置基于注解的声明式事务: ...配置tx,aop的命名空间 xmlns:tx="http://www.springframework.org/schema/tx" xmlns:a ...