js 在定義的時候立即執行的函數表達式(function)寫法_javascript技巧

1.前言
函數需要先定義，然後再使用。 這基本上所有程式語言的一條鐵的定律。
一般狀況下， 我們需要呼叫一個JavaScript 函數, 基本的狀況都是先定義， 然後再呼叫。 看一個例子

複製程式碼 程式碼如下:

<script> <BR>//define function <BR>function sayHello() <BR>{ <BR>alert("hello"); <BR> } <BR>//call function <BR>sayHello(); <BR></script>

但如果不需要顯示呼叫函數， 讓這個函數在定義的時候就執行的話， 如何寫才可以呢？
2.思考的歷程
從以上的例子來看，聰明的你結合以上的使用狀況可能會想：
===》既然調用的時候是在函數名後面加上一對是否在function 定義的後面加上一對大括號是否就可以執行了呢？ 像以下這樣：

複製程式碼 程式碼如下:

function sayHello()
alert("hello");
}();

不幸的是，以上的寫法會報出js 的語法錯誤。
因為Javascript 的解析器在解析器解析全域的function或function內部function關鍵字的時候， 預設會把大括號解析成function聲明，而不是function表達式。

也就是說， 會把最後的一對大括號預設解析成一個缺少名字的function，並且拋出一個語法錯誤訊息，因為function宣告需要一個名字。

===》 你可能又會想， 如果我在大括號中傳入參數是否就會解析成表達式了呢？

複製程式碼 程式碼如下:

function sayHello()


function sayHello()
{
("hello");

}(1);

的確， 錯誤是沒有了。 但以上的寫法等同於以下寫法的效果複製程式碼

程式碼如下:


程式碼如下:

{

alert("hello");
};
(1);
這兩句完全沒有關係，函數還是不會執行

3.正確的寫法 對JavaScript 來說，括弧()裡面不能包含語句，所以在這一點上，解析器在解析function關鍵字的時候，會將對應的程式碼解析成function表達式，而不是function宣告所以，只要將大括號將程式碼(包括函數部分和在後面加上一對大括號)全部括起來就可以了。

複製程式碼

程式碼如下:


(function sayHello()

{
(function sayHello()
alert("hello");

}()); 還有一種寫法也可以， 就是將後面的大括號移出來， as

複製程式碼


程式碼如下:

(function sayHello()
{
alert("hello"); })();
推薦是使用第一種方式。 但是目前很多比較好的js library 使用的都是第二種方式。 例如： web 圖形繪製的: git , draw2d ,....