js 在定義的時候立即執(zhí)行的函數(shù)表達(dá)式(function)寫法
更新時間：2013年01月16日 12:17:11 作者：
如果不需要顯示調(diào)用函數(shù)， 讓這個函數(shù)在定義的時候就執(zhí)行的話， 該如何寫才可以呢,接下來將詳細(xì)介紹實(shí)現(xiàn)步驟，感興趣的朋友可以了解下
1.前言
函數(shù)需要先定義，后使用。 這基本上所有編程語言的一條鐵的定律。
一般狀況下， 我們需要調(diào)用一個JavaScript 函數(shù), 基本的狀況都是先定義， 然后再調(diào)用。 看一個例子
<!--by oscar999 2013-1-16-->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Say Hello</title>
</head>
<body>
<script>
//define function
function sayHello()
{
alert("hello");
}
//call function
sayHello();
</script>
</body>
</html>
但是如果不需要顯示調(diào)用函數(shù)， 讓這個函數(shù)在定義的時候就執(zhí)行的話， 該如何寫才可以呢？
2.思考的歷程
從以上的例子來看，聰明的你結(jié)合以上的使用狀況可能會想：
===》既然調(diào)用的時候是在函數(shù)名后面加上一對 是否在function 定義的后面加上一對大括號是否就可以執(zhí)行了呢？ 像以下這樣：
function sayHello()
{
alert("hello");
}();
不幸的是，以上的寫法會報出js 的語法錯誤。
因?yàn)镴avascript 的解析器在解析器解析全局的function或者function內(nèi)部function關(guān)鍵字的時候， 默認(rèn)會把大括號解析成function聲明，而不是function表達(dá)式。
也就是說， 會把最后的一對大括號默認(rèn)解析成一個缺少名字的function，并且拋出一個語法錯誤信息，因?yàn)閒unction聲明需要一個名字。
===》 你可能又會想， 如果我在大括號中傳入?yún)?shù)是否就會解析成表達(dá)式了呢？
function sayHello()
{
alert("hello");
}(1);
的確， 錯誤是沒有了。 但是以上的寫法等同于以下寫法的效果
function sayHello()
{
alert("hello");
};
(1);
這兩句完全沒有關(guān)系， 函數(shù)還是不會執(zhí)行
3.正確的寫法
對于JavaScript 來說，括弧()里面不能包含語句，所以在這一點(diǎn)上，解析器在解析function關(guān)鍵字的時候，會將相應(yīng)的代碼解析成function表達(dá)式，而不是function聲明所以，只要將大括號將代碼(包括函數(shù)部分和在后面加上一對大括號)全部括起來就可以了。
(function sayHello()
{
alert("hello");
}());
還有一種寫法也可以， 就是將后面的大括號移出來， as
(function sayHello()
{
alert("hello");
})();
推薦是使用第一種方式。
但是目前很多比較好的js library 使用的都是第二種方式。
比如： web 圖形繪制的: git , draw2d ,....
函數(shù)需要先定義，后使用。 這基本上所有編程語言的一條鐵的定律。
一般狀況下， 我們需要調(diào)用一個JavaScript 函數(shù), 基本的狀況都是先定義， 然后再調(diào)用。 看一個例子
復(fù)制代碼 代碼如下:
<!--by oscar999 2013-1-16-->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Say Hello</title>
</head>
<body>
<script>
//define function
function sayHello()
{
alert("hello");
}
//call function
sayHello();
</script>
</body>
</html>
但是如果不需要顯示調(diào)用函數(shù)， 讓這個函數(shù)在定義的時候就執(zhí)行的話， 該如何寫才可以呢？
2.思考的歷程
從以上的例子來看，聰明的你結(jié)合以上的使用狀況可能會想：
===》既然調(diào)用的時候是在函數(shù)名后面加上一對 是否在function 定義的后面加上一對大括號是否就可以執(zhí)行了呢？ 像以下這樣：
復(fù)制代碼 代碼如下:
function sayHello()
{
alert("hello");
}();
不幸的是，以上的寫法會報出js 的語法錯誤。
因?yàn)镴avascript 的解析器在解析器解析全局的function或者function內(nèi)部function關(guān)鍵字的時候， 默認(rèn)會把大括號解析成function聲明，而不是function表達(dá)式。
也就是說， 會把最后的一對大括號默認(rèn)解析成一個缺少名字的function，并且拋出一個語法錯誤信息，因?yàn)閒unction聲明需要一個名字。
===》 你可能又會想， 如果我在大括號中傳入?yún)?shù)是否就會解析成表達(dá)式了呢？
復(fù)制代碼 代碼如下:
function sayHello()
{
alert("hello");
}(1);
的確， 錯誤是沒有了。 但是以上的寫法等同于以下寫法的效果
復(fù)制代碼 代碼如下:
function sayHello()
{
alert("hello");
};
(1);
這兩句完全沒有關(guān)系， 函數(shù)還是不會執(zhí)行
3.正確的寫法
對于JavaScript 來說，括弧()里面不能包含語句，所以在這一點(diǎn)上，解析器在解析function關(guān)鍵字的時候，會將相應(yīng)的代碼解析成function表達(dá)式，而不是function聲明所以，只要將大括號將代碼(包括函數(shù)部分和在后面加上一對大括號)全部括起來就可以了。
復(fù)制代碼 代碼如下:
(function sayHello()
{
alert("hello");
}());
還有一種寫法也可以， 就是將后面的大括號移出來， as
復(fù)制代碼 代碼如下:
(function sayHello()
{
alert("hello");
})();
推薦是使用第一種方式。
但是目前很多比較好的js library 使用的都是第二種方式。
比如： web 圖形繪制的: git , draw2d ,....
您可能感興趣的文章:
- js function定義函數(shù)使用心得
- JS函數(shù)的幾種定義方式分析
- javascript定義函數(shù)的方法
- JavaScript定義類或函數(shù)的幾種方式小結(jié)
- JS 自定義帶默認(rèn)值的函數(shù)
- javascript自定義函數(shù)參數(shù)傳遞為字符串格式
- 100個不能錯過的實(shí)用JS自定義函數(shù)
- javascript 定義初始化數(shù)組函數(shù)
- javascript 自定義回調(diào)函數(shù)示例代碼
- Javascript 使用function定義構(gòu)造函數(shù)
- JS函數(shù)基本定義與用法示例
相關(guān)文章
ECMAScript是瀏覽器腳本語言的規(guī)范,而我們熟知的js語言,如JavaScript則是規(guī)范的具體實(shí)現(xiàn),下面這篇文章主要給大家介紹了關(guān)于ES6語法總結(jié)的相關(guān)資料,需要的朋友可以參考下2022-05-05
這篇文章主要介紹了JS打字效果的動態(tài)菜單，推薦給大家，有需要的小伙伴可以參考下。2015-08-08
這篇文章主要為大家詳細(xì)介紹了javascript特殊文本輸入框網(wǎng)頁特效,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
這篇文章主要給大家介紹了關(guān)于如何判斷iOS、Android以及PC端的相關(guān)資料，主要是利用navigator.userAgent來實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
讓背景如此暗淡（一種彈出提示信息時頁面背景色調(diào)改變的方法）
讓背景如此暗淡（一種彈出提示信息時頁面背景色調(diào)改變的方法）...2006-10-10
JavaScript實(shí)現(xiàn)聯(lián)動菜單特效
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)聯(lián)動菜單特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-01-01
本文給大家分享的是一段兼容各大瀏覽器的JavaScript阻止事件冒泡代碼，雖然因?yàn)闀r間問題沒有深入研究，但是還是相當(dāng)不錯的，這里推薦給大家2015-07-07
深入學(xué)習(xí)JavaScript執(zhí)行上下文
這篇文章主要介紹了深入學(xué)習(xí)JavaScript執(zhí)行上下文,文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的朋友可以參考一下，希望對你的學(xué)習(xí)有所幫助2022-08-08
js實(shí)現(xiàn)HashTable(哈希表)的實(shí)例分析
本文詳細(xì)介紹javascript哈希表的實(shí)例分析及用法。下面就跟小編一起來學(xué)習(xí)下吧2016-11-11
js的壓縮及jquery壓縮探討(提高頁面加載性能/保護(hù)勞動成果)
搞定js的加密和壓縮，一方面可以提高頁面加載性能，另外一方面也希望辛苦研發(fā)出來的成果得到一定的保護(hù),感興趣的朋友可以了解下，或許對你有所幫助2013-01-01