iT邦幫忙

2021 iThome 鐵人賽

DAY 19
1
自我挑戰組

開始入坑網頁吧!系列 第 19

JavaScript IIFE (立即函數)

  • 分享至 

  • xImage
  •  

甚麼是立即函數?

IIFE (Immediately Invoked Function Expression)從字面上可以知道
就是一個 在宣告當下就會馬上被執行的函數
語法:

(function(){
 // 被執行的程式碼
}());

它呼叫函數的 () 也可以寫在外面如下:

(function(){
 // 被執行的程式碼
})();

下面這個範例是用變數來接立即函數回傳的值(注意hello不是函式),看好了!

var hello = (function(name){
return 'Hello '+name;
}('Ivy'));

console.log(hello);//Hello Ivy

立即函式可以保護全域命名環境不受汙染,也用來減少全域變數的使用
很多有名的Javascript的函式庫也都用立即函式,例如JQuery。
EX:

(function () {

   // name 是一個區域變數
   var name = 'Ivy Huang';
   
   // 顯示 Ivy Huang
  console.log(name);

}());

//但是在外面呼叫既會出錯
console.log(name);// Uncaught ReferenceError: name is not defined

立即函式的使用時機

適合用在只執行一次的程式碼,如此可以少用全域變數,也可以保護裡面的變數不會暴露在全域之中(才不會任人取用),此外全域變數區域化可以減少檔案的大小,好處多多。

參考文章:
JavaScript 立即執行函數 IIFE (Immediately Invoked Function Expression) / Self-invoking Function
立即函式(IIFE)
你不可不知的 JavaScript 二三事#Day24:函數呼叫 (Function Invocation) 與立即函數 (Self-Invoking Functions)


上一篇
JavaScript Arguments and Spread
下一篇
JavaScript Call, Bind, Apply
系列文
開始入坑網頁吧!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言