立即执行函数

什么是立即执行函数？

IIFE Immediately Invoked Function Expression

     立即地      调用    （函数      表达式）

立即执行函数就是

声明一个匿名函数马上调用这个匿名函数

js中函数的两种命名方式，即表达式和声明式

函数声明 !== 函数表达式


//函数声明： function fnName() {...} ；
//使用 function 关键字声明一个函数，再执行一个函数名，叫函数声明。
function test1(){
    console.log('Function Declaration');
}

//把一个（匿名）函数（函数声明式）赋值给一个变量的形式  函数表达式
let test2 = function(){
    console.log('Function Expression');
}

//()对于函数名后面的括号，叫做执行符号
test1()
test2()

//语法错误，执行符号只能跟在函数表达式后面
function test(){
    console.log('Function Declaration');
}();

函数声明和函数表达式不同之处在于

1.JavaScript 引擎在解析 JavaScript 代码时会“函数声明提升”当前执行环境(作用域)上的函数声明，而函数表达式必须等到 JavaScript 引擎执行到它所在行时，才会从上而下一行一行地解析函数表达式。

2.函数表达式后面可以加括号立即调用该函数，函数声明不可以，只能以 fnName() 形式调用。

当一个函数需要立即执行时，要在函数体后面加括号就能立即调用，则这个函数必须是函数表达式，不能是函数声明。要让Javascript引擎认为这是一个表达式的方法有很多：

// 1 （1） +1 !1 ~1

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

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

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

//w3c推荐的立即执行函数的编写规范
(function(){
    console.log('Function Expression');
}())

//开发时常用
(function(){
     console.log('Function Expression');
})()

为什么使用立即执行函数？

1.避免向全局作用域中添加变量和函数，因此也避免了多人开发中全局变量和函数的命名冲突

2.立即执行函数定义的任何变量和函数，都会在执行结束时被销毁。这样可以减少闭包占用的内存问题

3.立即执行函数常用于第三方库，例如jQuery开篇用的就是立即执行函数，

(function(window, undefined) {
   
})(window);

他的好处在于隔离作用域，任何一个第三方库都会存在大量的变量和函数，为了避免变量污染（命名冲突）想到的解决办法就是使用立即执行函数。立即执行函数和普通函数区别是什么呢，唯一的区别就是，立即执行函数,执行完毕会被立即释放，其他就没有了

(function test(a,b,c,d){
    //可以创建一个与外界没有任何关联的作用域，独立作用域
    //执行完成以后，自动销毁
    //立即执行函数可以来模拟模块化
      //封闭作用域、抛出接口
    //向外部抛出一系列属性和方法
    //window 上保存属性和方法
    console.log(test);
    console.log(test.length);//4
    console.log(arguments.length);//3
    console.log('hello');
})(1,2,3)