自執行函數：自動執行的函數。它在被解釋時就已經在運行了。一般函數都是在被調用時才會執行的。
自執行函數的一般格式：(function() { 函數體 })();
而且，自執行函數中一般都會有一個function() {}形式的匿名函數。
下面的代碼在window對象中創建一個命名空間 mySpace，並把自執行函數中的方法封裝在mySpace命名空間之下，以便於我們調用這個自執行函數中的一些功能。
復制代碼 代碼如下:
(function() {
//根據id獲取對象
function $(id) { return document.getElementById(id); }
//內部函數，在外層是不可以調用的
function _setStyle(id, styleName, styleValue) {
$(id).style[styleName] = styleValue;
}
//創建偽命名空間
window.mySpace = {};
//將內部函數_setStyle封裝在mySpace命名空間內
//調用時，使用window.mySpace.setStyle(id, styleName, styleValue)
window.mySpace.setStyle = _setStyle;
})();
//下面是測試代碼
window.onload = function() {
//將id為test的對象的文字顏色設置為紅色
window.mySpace.setStyle("test", "color", "#f00");
}
那麼這種封裝方式到底有何好處呢？
當然就是保護了自執行函數內的方法、變量、屬性等。這樣代碼更加安全了。
如果不使用這種方法，那麼，下面的方法也可以實現的。
復制代碼 代碼如下:
window.mySpace = {};
window.mySpace.$ = function(id) { return document.getElementById(id); }
window.mySpace.setStyle = function(id, styleName, styleValue) {
window.mySpace.$("test").style[styleName] = styleValue;
}
//下面是測試代碼
window.onload = function() {
window.mySpace.setStyle("test", "backgroundColor", "#f00");
window.mySpace.setStyle("test", "color", "#fff");
}
上面的代碼和自執行函數實現的功能其實是一樣的。
比較之後，我們可以發現，第二方法更加的直觀，易於理解。但是少了封裝過程，代碼完全裸露在外。