JS 關於(function( window, undefined ) {})(window)寫法的理解

JS 關於(function( window, undefined ) {})(window)寫法的理解 [網絡整理]

(function( window, undefined ) {})(window);
這個，爲什麼要將window和undefined作爲參數傳給它？

 

(function( $, undefined ) {})(jQuery); 同理

 

因爲 ecmascript 執行JS代碼是從裏到外，因此把全局變量window或jQuery對象傳進來，就避免了到外層去尋找，提高效率。undefined在老一輩的瀏覽器是不被支持的，直接使用會報錯，js框架要考慮到兼容性，因此增加一個形參undefined。

還有，不要用window.undefined傳遞給形參，有可能window.undefined被其他人修改了，最好就是甚麼都不傳，形參的undefined就是真正的undefined了。

 

var undefined = 8;
(function( window ) { 
    alert(window.undefined); // 8
    alert(undefined); // 8
})(window);

與

var undefined = 8;
(function( window, undefined ) { 
    alert(window.undefined);  // 8
    alert(undefined); // 此處undefined參數爲局部的名稱爲undefined變量，值爲undefined
})(window);

區分上述兩種方式：第一種每個語句都要去找一次window。第二種將window作爲參數傳遞過去，是的不要每個語句都去找window，應該是提高了效率。 所以後者，就算外面的人把 undefined 定義了，裏面的 undefined 依然不受影響。大概是爲了最大程度防止外界的變量定義對所做封裝的內部造成影響吧。

 

//方式一
(function(undefined ) {
   window.property1 = ……;
   window.property2 = ……;
   ……
})();
//方式二
(function( window, undefined ) {
    ... // code goes here

})(window);
//方式三
(function(undefined ) {
   var tmp = window;
   tmp.property1 = ……;
   tmp.property2 = ……;
   ……
})();

方式一的效率明顯最低，方式二和方式三應該差不多。將window作爲參數傳遞進去就可以讓代碼裏面的語句可以直接用參數中的window，而不用再去找最外層的對象。假如要在函數中爲window再設置 100000個屬性，用參數傳遞過去只需要找一次最外層對象。不用參數傳遞，用到window的語句都要去找一次最外層對象。