Photo by Mohammad Rahmani on Unsplash

declaration (函式运算式)

function declarationFunction(){
	console.log(123);
}

declarationFunction();

function expression (函式陈述式)

let expressionFunction = function(){
	console.log(123);
}

expressionFunction();

差异

提前使用 function

declaration (函式运算式) 因为 hoisting 提升 的关係，所以可以顺利执行

declarationFunction();

function declarationFunction(){
    // 123
    console.log(123);
}

expression (函式陈述式) 则是因为变数尚未未宣告内容，所以无法执行

// ReferenceError: Cannot access 'expressionFunction' before initialization
expressionFunction();

let expressionFunction = function(){
    console.log(123);
}

记忆体回收机制

declaration (函式运算式)

• 只要被定义过后就无法从记忆体中删除并回收

expression (函式陈述式)

• 正常的跟着变数生命週期运作, 所以可能定义完后则直接被回收或是跟着变数的参考被移除时就结束等待 Garbage Collection 回收

正常回收记忆体

declaration (函式运算式) 直接被回收

// declaration (函式运算式)直接被回收
(function(val){
    console.log(val);
})(123);

expression (函式陈述式) 变数设定为 null 被回收

let expressionFunction=function(){
    console.log(123);
}

expressionFunction();
expressionFunction=null;
// expressionFunction is not a function
expressionFunction();

参考资料

• function expression(函式陈述式) VS declaration (函式运算式) | Blackie’s Failed Notes

Donate KJ 贊助作者喝咖啡

如果這篇文章對你有幫助的話，可以透過下面支付方式贊助作者喝咖啡，如果有什麼建議或想說的話可以贊助並留言給我

If this article has been helpful to you, you can support the author by treating them to a coffee through the payment options below. If you have any suggestions or comments, feel free to sponsor and leave a message for me!