全網最易懂版:什麼是立即執行函數?有什麼作用?

2020年3月12日
《每日一題系列🚀》
作者:王二狗
博客:掘金思否知乎簡書CSDN
點贊再看,養成習慣,每日一題系列會一直更新下去,你們的支持是我持續分享的最大動力😘

什麼是立即執行函數?

要成爲立即執行函數,需要滿足兩個條件:

  • 聲明一個匿名函數
  • 立馬調用這個匿名函數

比如,下面就是一個非常典型的立即執行函數:

(function(){console.log('這是一個立即執行函數'))()

//首先聲明一個匿名函數(function(){console.log('這是一個立即執行函數'))
//然後再匿名函數的後面接一對括號(),立馬調用這個函數

大多數小夥伴不理解的可能是爲什麼要把匿名函數用一對括號包起來。

其實,這麼做的目的是爲了兼容JS的語法。

除了使用一對括號之外,我們還可以使用下面的語法:

(function(){alert('我是匿名函數')} ()) 
(function(){alert('我是匿名函數')}) ()
!function(){alert('我是匿名函數')}() 
+function(){alert('我是匿名函數')}()
-function(){alert('我是匿名函數')}()
~function(){alert('我是匿名函數')}()
void function(){alert('我是匿名函數')}()
new function(){alert('我是匿名函數')}()

立即執行函數有什麼作用?

立即執行函數的作用只有一個,那就是創建獨立的作用域
讓外部無法訪問作用域內部的變量,從而避免變量污染

比如下面的代碼,我們就可以使用立即執行函數讓for循環輸出的值是16,而不是66

for(var i=0; i<6; i++){
  !function(i){//這個i是獨立作用域裏面的i
        console.log(i)//這個i是獨立作用域裏面的i
    }
  }(i)//這個i是for循環中的i
}

上面的代碼之所以輸出的結果是16,而不是66,是因爲我們每次都將for循環中的i單獨賦值給了for循環內部的i

每一次for循環內i值變化的時候,我們都立即執行函數在for循環內部創建了一個獨立的作用域,所以最終輸出的結果是16

很多小夥伴在看這段代碼的時候都容易被裏面的i值所混淆,其實兩個i並不是同一個值。

下面的代碼會讓你更加容易理解:

for(var i=0; i<6; i++){
  !function(j){
    console.log(j)//這個i是獨立作用域裏面的i
  }(i)
}

告誡自己,即使再累也不要忘記學習,成功沒有捷徑可走,只有一步接着一步走下去。 共勉!

文章中如有不對的地方,歡迎小夥伴們多多指正。

謝謝大家~ 💘

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章