javascript
JavaScript中的立即执行函数
原文鏈接
通常我們聲明一個函數(shù)有以下幾種方式:
// 聲明函數(shù)f1 function f1() {console.log("f1"); } // 通過()來調(diào)用此函數(shù) f1();//一個匿名函數(shù)的函數(shù)表達(dá)式,被賦值給變量f2: var f2 = function() {console.log("f2"); } //通過()來調(diào)用此函數(shù) f2();//一個命名為f3的函數(shù)的函數(shù)表達(dá)式(這里的函數(shù)名可以隨意命名,可以不必和變量f3重名),被賦值給變量f3: var f3 = function f3() {console.log("f3"); } //通過()來調(diào)用此函數(shù) f3();復(fù)制代碼如果你看過一些自定義控件的話你會發(fā)現(xiàn)他們大多數(shù)都是沿用這種寫法:
(function() {復(fù)制代碼 // 這里開始寫功能需求
})();
我們發(fā)現(xiàn)這里f只是這個匿名函數(shù)的一個引用變量,那么既然f()能夠調(diào)用這個函數(shù),我把f替換成函數(shù)本身可以么:
function(){console.log("f"); }();復(fù)制代碼運(yùn)行之后得到如下結(jié)果:
Uncaught SyntaxError: Unexpected token (復(fù)制代碼產(chǎn)生這個錯誤的原因是,Javascript引擎看到function關(guān)鍵字之后,認(rèn)為后面跟的是函數(shù)聲明語句,不應(yīng)該以圓括號結(jié)尾。解決方法就是讓引擎知道,圓括號前面的部分不是函數(shù)定義語句,而是一個表達(dá)式,可以對此進(jìn)行運(yùn)算,這里區(qū)分一下函數(shù)聲明和函數(shù)表達(dá)式:
1、函數(shù)聲明(即我們通常使用function x(){}來聲明一個函數(shù)) function myFunction () { /* logic here */ } 2、函數(shù)表達(dá)式(類似以這種的形式) var myFunction = function () { /* logic here */ }; var myObj = {myFunction: function () { /* logic here */ } };復(fù)制代碼小學(xué)我們就學(xué)過用()括起來的表達(dá)式會先執(zhí)行,就像下面這樣:
1+(2+3) //這里先運(yùn)行小括號里面的內(nèi)容沒有意見撒復(fù)制代碼其實(shí)在javascript中小括號也有相似的作用,Javascript引擎看到function關(guān)鍵字會認(rèn)為是函數(shù)聲明語句,那么如果Javascript引擎優(yōu)先看到小括號會怎么樣:
//用小括號把函數(shù)包裹起來 (function(){console.log("f"); })();復(fù)制代碼函數(shù)成功執(zhí)行了:
f //控制臺輸出復(fù)制代碼這種情況下Javascript引擎就會認(rèn)為這是一個表達(dá)式,而不是函數(shù)聲明,當(dāng)然要讓Javascript引擎認(rèn)為這是一個表達(dá)式的方法還有很多:
!function(){}(); +function(){}(); -function(){}(); ~function(){}(); new function(){ /* code */ } new function(){ /* code */ }() // 只有傳遞參數(shù)時,才需要最后那個圓括號。 ……復(fù)制代碼回到前面的問題,為什么說IIFE這種形式避免了污染全局變量,如果你見過別人寫的jquery插件,里面通常會有類似這樣的代碼:
(function($){復(fù)制代碼 //插件實(shí)現(xiàn)代碼
})(jQuery);
`` 這里的jquery其實(shí)是該匿名函數(shù)的參數(shù),聯(lián)想一下我們調(diào)用匿名函數(shù)時候是用f()那么匿名帶參數(shù)的就是f(args)對吧,這里把jquery作為參數(shù)傳入該函數(shù),那么在函數(shù)內(nèi)部使用形參$的時候就不會影響到外部環(huán)境,因?yàn)橛行┎寮矔玫?`這個限定符,你在這個函數(shù)內(nèi)部可以隨意折騰。
以上,在此過程中參考了以下兩篇文章:
javascript立即執(zhí)行某個函數(shù):插件中function(){}()再思考
JavaScript中的立即執(zhí)行函數(shù)
總結(jié)
以上是生活随笔為你收集整理的JavaScript中的立即执行函数的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: mysql linux版安装
- 下一篇: html回顾随笔JS(*^__^*)