javascript中的立即执行函数(function(){…})()

关键词：

javascript中的立即执行函数(function(){…})()

深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是用(function(){…})()包住业务代码,使用jquery时比较常见。

( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法，最初我以为是一个括号包裹匿名函数，再在后面加个括号调用函数，最后达到函数定义后立即执行的目的，后来发现加括号的原因并非如此。要理解立即执行函数，需要先理解一些函数的基本概念。

函数声明、函数表达式、匿名函数

函数声明：function fnName () {…};使用function关键字声明一个函数，再指定一个函数名，叫函数声明。

函数表达式 var fnName = function () {…};使用function关键字声明一个函数，但未给函数命名，最后将匿名函数赋予一个变量，叫函数表达式，这是最常见的函数表达式语法形式。

匿名函数：function () {}; 使用function关键字声明一个函数，但未给函数命名，所以叫匿名函数，匿名函数属于函数表达式，匿名函数有很多作用，赋予一个变量则创建函数，赋予一个事件则成为事件处理程序或创建闭包等等。

函数声明和函数表达式不同之处在于，一、Javascript引擎在解析javascript代码时会‘函数声明提升‘（Function declaration Hoisting）当前执行环境（作用域）上的函数声明，而函数表达式必须等到Javascirtp引擎执行到它所在行时，才会从上而下一行一行地解析函数表达式，二、函数表达式后面可以加括号立即调用该函数，函数声明不可以，只能以fnName()形式调用 。以下是两者差别的两个例子。

fnName();
function fnName(){
  ...
}
//正常，因为‘提升‘了函数声明，函数调用可在函数声明之前
  
fnName();
var fnName=function(){
  ...
}
//报错，变量fnName还未保存对函数的引用，函数调用必须在函数表达式之后

var fnName=function(){
  alert(‘Hello World‘);
}();
//函数表达式后面加括号，当javascript引擎解析到此处时能立即调用函数
function fnName(){
  alert(‘Hello World‘);
}();
//不会报错，但是javascript引擎只解析函数声明，忽略后面的括号，函数声明不会被调用
function(){
  console.log(‘Hello World‘);  
}();
//语法错误，虽然匿名函数属于函数表达式，但是未进行赋值操作，
//所以javascript引擎将开头的function关键字当做函数声明，报错：要求需要一个函数名

在理解了一些函数基本概念后，回头看看( function(){…} )()和( function (){…} () )这两种立即执行函数的写法，最初我以为是一个括号包裹匿名函数，并后面加个括号立即调用函数，当时不知道为什么要加括号，后来明白，要在函数体后面加括号就能立即调用，则这个函数必须是函数表达式，不能是函数声明。

(function(a){
  console.log(a);  //firebug输出123,使用（）运算符
})(123);
  
(function(a){
  console.log(a);  //firebug输出1234，使用（）运算符
}(1234));
  
!function(a){
  console.log(a);  //firebug输出12345,使用！运算符
}(12345);
  
+function(a){
  console.log(a);  //firebug输出123456,使用+运算符
}(123456);
  
-function(a){
  console.log(a);  //firebug输出1234567,使用-运算符
}(1234567);
  
var fn=function(a){
  console.log(a);  //firebug输出12345678，使用=运算符
}(12345678)

可以看到输出结果，在function前面加！、+、 -甚至是逗号等到都可以起到函数定义后立即执行的效果，而（）、！、+、-、=等运算符，都将函数声明转换成函数表达式，消除了javascript引擎识别函数表达式和函数声明的歧义，告诉javascript引擎这是一个函数表达式，不是函数声明，可以在后面加括号，并立即执行函数的代码。

加括号是最安全的做法，因为！、+、-等运算符还会和函数的返回值进行运算，有时造成不必要的麻烦。

不过这样的写法有什么用呢？

javascript中没用私有作用域的概念，如果在多人开发的项目上，你在全局或局部作用域中声明了一些变量，可能会被其他人不小心用同名的变量给覆盖掉，根据javascript函数作用域链的特性，可以使用这种技术可以模仿一个私有作用域，用匿名函数作为一个“容器”，“容器”内部可以访问外部的变量，而外部环境不能访问“容器”内部的变量，所以( function(){…} )()内部定义的变量不会和外部的变量发生冲突，俗称“匿名包裹器”或“命名空间”。

JQuery使用的就是这种方法，将JQuery代码包裹在( function (window,undefined){…jquery代码…} (window)中，在全局作用域中调用JQuery代码时，可以达到保护JQuery内部变量的作用。

转载自：http://www.jb51.net/article/50967.htm。

javascript中的立即执行函数(代码片段)

javascript中的立即执行函数$(function()　　alert();())Highcharts的中的series:[　　name:‘今日在线人数‘,　　color:‘pink‘,　　data:(function()　　　　)())]#执行效果一样$(document).ready(function()console.log("ready!"););和$(function( 查看详情

深入理解javascript中的立即执行函数(function()…)()(代码片段)

javascript和其他编程语言相比比较随意，所以javascript代码中充满各种奇葩的写法，有时雾里看花，当然，能理解各型各色的写法也是对javascript语言特性更进一步的深入理解。(function()…)()和(function()…())是两种javascript立即... 查看详情

javascript中的立即执行函数(代码片段)

通常我们声明一个函数有以下几种方式：//声明函数f1functionf1()console.log("f1");//通过()来调用此函数f1();//一个匿名函数的函数表达式，被赋值给变量f2:varf2=function()console.log("f2");//通过()来调用此函数f2();//一个... 查看详情

javascript自动执行函数（立即调用函数）

开头：各种原因总结一下javascript中的自动执行函数（立即调用函数）的一些方法，正文如下  在Javascript中，任何function在执行的时候都会创建一个执行上下文，因为function声明变量和function有可能只在该function内部，这个... 查看详情

javascript闭包立即执行函数(代码片段)

JavaScript闭包文章目录JavaScript闭包一、为什么要闭包二、让某些变量得以常驻内存1.原理2.Why立即执行函数?三、让外部得以访问函数内变量四、立即执行函数总结#前言-什么是闭包函数闭包函数是声明在另一个函数内的函数,是被... 查看详情

（转）扫盲--javascript的立即执行函数

看过jQuery源码的人应该知道，jQuery开篇用的就是立即执行函数。立即执行函数常用于第三方库，好处在于隔离作用域，任何一个第三方库都会存在大量的变量和函数，为了避免变量污染（命名冲突），开发者们想到的解决办法就... 查看详情

javascript--立即执行函数

　　当函数被包含在一堆括号()内部就称为了一个表达式，通过在末尾上加上另一个()可以立即执行这个函数，这样的表达式就叫做立即执行函数表达式(ImmediatelyInvokedFunctionExpression，简称IIFE)，如：(function(){...})()或者(function(){...}... 查看详情

javascript权威指南--立即执行函数

千万不要停下追逐梦想的脚步(function(){//executethismethodimmediatly.//content...}());  查看详情

Javascript - 存储为变量时立即执行的函数？

】Javascript-存储为变量时立即执行的函数？【英文标题】：Javascript-FunctionBeingExecutedImmediatelywhenStoredasVariable?【发布时间】：2015-09-2507:03:33【问题描述】：第一次发帖。编程新手。在Javascript中，当我声明一个新变量并将这个新声... 查看详情

前端小小白的学习之路javascript中的十个难点，你有必要知道。

1.立即执行函数立即执行函数，即ImmediatelyInvokedFunctionExpression(IIFE)，正如它的名字，就是创建函数的同时立即执行。它没有绑定任何事件，也无需等待任何异步操作：(function(){//代码//...})();function(){…}是一个匿名函数，包围... 查看详情

js立即执行函数

javascript和其他编程语言相比比较随意，所以javascript代码中充满各种奇葩的写法，有时雾里看花，当然，能理解各型各色的写法也是对javascript语言特性更进一步的深入理解。(function(){…})()和(function(){…}())是两种javascript立即执行... 查看详情

javascript立即执行函数

在项目中看到这么一段代码!function(){//dosomething}();之前知道一点立即执行的概念，但是看见感叹号！（非）就有点懵了，这是要干啥。继续往下看。 待续   参考地址：https://segmentfault.com/a/1190000003985390https://segmentfau... 查看详情

javascript立即执行函数学习

1.新建对象，方法内变量作用域理解错误varmd1={count:0,add:function(){count++;},sub:function(){count--;},show:function(){console.log(count);}};md1.add();md1.add();md1.show();在不加this的情况之下，会试图与当前对象的作用域内寻找count。如果硬要这样写，就... 查看详情

javascript初阶--------函数闭包立即执行函数

　函数　　　　　有时候我们的代码重复了很多次，编程里面称为耦合，但是编程要讲究高内聚，弱耦合。为了将重复多的聚在一起就出现了函数。定义　　　　函数基本要素：函数声明（function），函数名称，参数（形参，实... 查看详情

javascript立即执行函数表达式（iife）

...e*/})();Q:为什么这样写，函数就嗯那个立即执行？A:因为在javascript里，括号内部不能包含语句，当解析器对代码进行解释的时候，先碰到了()，然后碰到function关键字就会自动将()里面的代码识别为函数表达式而不是函数声明。eg：... 查看详情

web前端-javascript中的函数（创建，参数，返回值，方法，函数作用域，立即执行函数）(代码片段)

...装函数的返回值立即执行函数方法函数作用域补充：JavaScript中的作用域相关概念简介函数（Function）函数也是一个对象函数中可以封装一些功能(代码),在需要时可以执行这些功能(代码)。函数中可以保存一些代码，... 查看详情

javascript闭包和立即执行函数的作用

一、闭包——closure　　先看一个闭包的例子。我们想实现一个计数器，最简单的方法就是定义一个全局变量，计数的时候将其加1。但是全局变量有风险，哪里都有可能不小心改掉它。那局部变量呢，它只在函数内部有效，函数... 查看详情

javascript学习-46.立即执行函数(代码片段)

前言立即执行函数有以下作用创建一个独立作用域，这个作用域里面的变量，外部访问不到，避免变量污染。闭包和私有数据使用语法有两种写法//第一种：用括号把整个函数定义和括号调用包裹起来(function()//函... 查看详情