请问JS函数声明和函数表达式的区别是什么

Question

请问JS函数声明和函数表达式的区别是什么

Answer 1

函数声明

1 2	fun(); function fun(){}

这样定义一个函数的时候，解析器会将fun提前，所以，fun即使放在函数声明之前，也是可以正常运行的。

函数表达式

1 2	fun(); var fun = function(){}

这种解析器会先定义一个fun，也就是

1 2 3

var fun; fun(); fun = function(){};

所以这样会出现错误。

 

Answer 2

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

//A：函数声明 sum(1,2);// 结果是：3 console.log(sum);//输出 result: function sum(a,b){ return a+b; } //这里打印出来的是下面声明的函数 function sum(a,b){     return a+b; }(1,2);//函数表达式被前置处理，留下表达式 (1,2) 单独运算  result：2   ----------------------------------------------------------------   //B：函数表达式 sum(1,2);//报错  type error:sum is not a function  ① console.log(sum);//输出 result: undefined   var sum=function(a,b){     return a+b; }(1,2);//可以立即调用  result：3   // 总结： 主要区别，函数声明，会被前置，可以理解为优先运算 //         函数表达式可以立即调用   // 补充： //   ①：变量声明，也会被前置，所以 B示例中 sum 的值是 undefined   //       而不是报 sum is not defined

Answer 3

上述两种方式除了定义的语法不同之外，最主要的区别是函数声明具有【函数声明提升】的特点，将函数声明提升到作用域顶端，意思是在执行代码之前会先读取函数声明，也就是说可以把函数声明放在函数调用的后面。

例子1：

1 2 3 4 5

test();//弹出hello，因为【函数声明提升】的特点，函数调用之前，已经读取了该函数完成了声明               function test(){                 alert("hello");             }

例子2：

1 2 3 4 5 6 7 8 9

test();//报错：Uncaught ReferenceError: test is not defined               //因为【函数表达式】不具备提升的特点，在函数调用时，作用域中还未读取该函数的定义             //作用域读取函数表达式是按照代码顺序读取             var test = function(){                 alert("hello");             }               test();//弹出hello

例子3：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

if(condition){                 function test(){                     alert("hello");                 }             }else{                 function test(){                     alert("world");                 }             }               //弹出world，因为函数声明在代码执行前就已经完成了，作用域已经完成了对该函数的读取，与条件无关             //同名函数声明，后面的会覆盖前面的             test();               if(condition){                 var test2 = function(){                     alert("hello");                 }             }else{                 var test2 = function(){                     alert("world");                 }             }             //弹出内容与条件相关，作用域读取函数表达式是按照代码执行顺序读取的             test2();

例子4：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

//函数表达式             var  test = function(){                 alert("hello");             }             //第一次调用             test();               //变量声明             var s = "world";               //函数声明             function test(){                 alert(s);             }             //第二次调用             test();           //解释：两次调用都将弹出hello，在代码执行前方式二已经被作用域读取，然后执行方式一代码，方式一的test覆盖方式二的test，然后执行两次调用弹出hello