JavaScript 函数声明，函数表达式，匿名函数的区别，深入理解立即执行函数(function(){…})()

Posted 2020-10-04 盒子豪

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

//例如：(正常，因为 提升 了函数声明，函数调用可以在函数声明之前)
fnName();
function fnName(){
  alert(\'Hello World\');
}




var fnName = function(){xxxx};  //函数表达式：使用function关键字声明一个函数，但是未给函数命名，最后将匿名函数赋予给一个变量。

//例如1:(报错，变量fnName还未保存对函数的引用，函数调用必须在函数表达式之后)
fnName();
var fnName = function(){
  alert(\'Hello World\');
}
//例如2:(正常，函数表达式后面加括号，当javascript引擎解析到此处时能立即调用函数)
var fnName = function(){
  alert(\'Hello World\');
}();
//例如3:(报错，JavaScript引擎只解析函数声明，忽略后面的括号，函数声明不会被调用)
function fnName(){
  alert(\'Hello World\');
}();




function(){xxxx};               //匿名函数：使用function关键字声明一个函数，但是未给函数命名，所以叫匿名函数，匿名函数属于函数表达式，
                                //匿名函数有很多作用，赋予一个变量则创建函数，赋予一个事件则成为事件处理程序或者创建闭包等等。
                                
//例如:(语法错误，语法错误，虽然匿名函数属于函数表达式，但是未进行赋值操作，所以javascript引擎将开头的function关键字当做函数声明，报错：要求需要一个函数名)
function(){
  alert(\'Hello World\');
}();

 先来给大家看两个小例子：（1）

var foo = 1;
　　(function(){
      console.log(foo);   
      var foo = 2;
      console.log(foo);   
})();

输出：undefined  和   2

（2） 

var foo = \'Hello\';
　　(function(){
    　　console.log(foo); 
    　　var bar = \'world\';
    　　console.log(foo + bar); 
    })();
console.log(foo + bar); 

 

 

如果我的内容对你有帮助，欢迎打赏