js的匿名函數(shù)使用介紹
更新時間：2013年12月11日 16:56:58 作者：
匿名函數(shù)的作用是創(chuàng)建一塊封閉區(qū)域，外面不能夠訪問里面的變量和方法，下面為大家介紹下什么是匿名函數(shù)及其如何使用
1.匿名函數(shù)概述
關于匿名函數(shù)的第一次認識還是在jquery源碼里，打開jQuery首先看到的是
(function( window, undefined ) {.......................})(window);
這就是一個匿名函數(shù)，紅色為參數(shù)，匿名函數(shù)的作用是創(chuàng)建一塊封閉區(qū)域，外面不能夠訪問里面的變量和方法。
既然不能訪問，那怎么能調(diào)用jquery？這是因為jquery的匿名函數(shù)有這樣兩句話（藍色字）：
(function( window, undefined ) {
// Define a local copy of jQuery
var jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context );
},
.........
window.jQuery = window.$ = jQuery;
})(window);
原來在匿名函數(shù)里將jQuery傳給了window，這也就是為什么參數(shù)的傳遞中要傳遞window，所以以后每次調(diào)用jquery其實是調(diào)用window的jQuery這個對象。
由jquery調(diào)用自己里面的方法。外面是無法調(diào)用的，這樣可以保證安全和不沖突。
2.接著上面的話題，關于jQuery的插件
以下是我寫的分頁控件的部分代碼：
;(function ($) {
$.fn.tabing = function (arg) {
instance = new Plugin(this, arg);
};
var instance = null;
function Plugin(element){
this._tabs = $(element);
this._tabli = $("a[href*='#']",this._tabs);
this._tabDiv = this._tabs.siblings().filter("div[id*='tab']");
this.init();
}
Plugin.prototype = {
init: function(){
this._tabli.addClass("unselected");
this._tabli.eq(0).addClass("selected");
this._tabDiv.css("display","none");
this._tabDiv.eq(0).css("display","block");
this._tabli.each(function(){
$(this).bind("click",function(){
for(var i = 0;i<instance._tabDiv.length;i++){
instance._tabDiv.eq(i).css("display","none");
}
instance._tabDiv.filter("#"+$(this).attr("href").split('#')[1]).css("display","block");
});
})
}
}
})(jQuery);
注意紅色的字，其實jQuery插件也是在寫匿名函數(shù)，這樣保證每個插件的獨立性，要不怎么叫插件，紅色的字$.fn.tabing說明在這個插件里面有個tabing給了jquery的fn，
這樣外面的jquery對象就可以直接調(diào)用tabing，這也是插件與外界的唯一接觸。
3. 說完了jquery插件對匿名函數(shù)的使用，再說一下window的匿名函數(shù)
其實jquery本身就是window的匿名函數(shù)，即第一點，那我們怎么寫window的匿名函數(shù)呢？
即寫了匿名函數(shù)后，在函數(shù)里面有個與window交互的接口，例如下面：
(function(){
function getObjByID(id){
return document.getElementById(id);
}
function __addClass(id,className,classValue){
$(id).style.className=classValue;
}
window.addClass=__addClass;
})();
同樣是看紅色的字，這樣在該匿名函數(shù)外就可以調(diào)用addClass（），但無法調(diào)用getObjByID（）。
4.匿名函數(shù)也會在解析的時候執(zhí)行
如下：
function Video() { };
function Movie() { };
var _video = new Video();
_video.size = 3;
_video.toString = function () {
return "video";
};
_video.getName = function () {
return "VideoXXX";
};
var _movie = new Movie();
(function (parent, child) {
for (var ele in parent) {
if (!child[ele]) //在child不包含該屬性或者方法的時候，才會拷貝parent的一份
child[ele] = parent[ele];
}
})(_video, _movie); //匿名函數(shù)調(diào)用的方式
alert(_movie.size); //3
alert(_movie.toString()); //[object Object]
alert(_movie.getName()); //VideoXXX
三個alert都有結(jié)果，說明了匿名函數(shù)內(nèi)部執(zhí)行了。
關于匿名函數(shù)的第一次認識還是在jquery源碼里，打開jQuery首先看到的是
復制代碼 代碼如下:
(function( window, undefined ) {.......................})(window);
這就是一個匿名函數(shù)，紅色為參數(shù)，匿名函數(shù)的作用是創(chuàng)建一塊封閉區(qū)域，外面不能夠訪問里面的變量和方法。
既然不能訪問，那怎么能調(diào)用jquery？這是因為jquery的匿名函數(shù)有這樣兩句話（藍色字）：
復制代碼 代碼如下:
(function( window, undefined ) {
// Define a local copy of jQuery
var jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context );
},
.........
window.jQuery = window.$ = jQuery;
})(window);
原來在匿名函數(shù)里將jQuery傳給了window，這也就是為什么參數(shù)的傳遞中要傳遞window，所以以后每次調(diào)用jquery其實是調(diào)用window的jQuery這個對象。
由jquery調(diào)用自己里面的方法。外面是無法調(diào)用的，這樣可以保證安全和不沖突。
2.接著上面的話題，關于jQuery的插件
以下是我寫的分頁控件的部分代碼：
復制代碼 代碼如下:
;(function ($) {
$.fn.tabing = function (arg) {
instance = new Plugin(this, arg);
};
var instance = null;
function Plugin(element){
this._tabs = $(element);
this._tabli = $("a[href*='#']",this._tabs);
this._tabDiv = this._tabs.siblings().filter("div[id*='tab']");
this.init();
}
Plugin.prototype = {
init: function(){
this._tabli.addClass("unselected");
this._tabli.eq(0).addClass("selected");
this._tabDiv.css("display","none");
this._tabDiv.eq(0).css("display","block");
this._tabli.each(function(){
$(this).bind("click",function(){
for(var i = 0;i<instance._tabDiv.length;i++){
instance._tabDiv.eq(i).css("display","none");
}
instance._tabDiv.filter("#"+$(this).attr("href").split('#')[1]).css("display","block");
});
})
}
}
})(jQuery);
注意紅色的字，其實jQuery插件也是在寫匿名函數(shù)，這樣保證每個插件的獨立性，要不怎么叫插件，紅色的字$.fn.tabing說明在這個插件里面有個tabing給了jquery的fn，
這樣外面的jquery對象就可以直接調(diào)用tabing，這也是插件與外界的唯一接觸。
3. 說完了jquery插件對匿名函數(shù)的使用，再說一下window的匿名函數(shù)
其實jquery本身就是window的匿名函數(shù)，即第一點，那我們怎么寫window的匿名函數(shù)呢？
即寫了匿名函數(shù)后，在函數(shù)里面有個與window交互的接口，例如下面：
復制代碼 代碼如下:
(function(){
function getObjByID(id){
return document.getElementById(id);
}
function __addClass(id,className,classValue){
$(id).style.className=classValue;
}
window.addClass=__addClass;
})();
同樣是看紅色的字，這樣在該匿名函數(shù)外就可以調(diào)用addClass（），但無法調(diào)用getObjByID（）。
4.匿名函數(shù)也會在解析的時候執(zhí)行
如下：
復制代碼 代碼如下:
function Video() { };
function Movie() { };
var _video = new Video();
_video.size = 3;
_video.toString = function () {
return "video";
};
_video.getName = function () {
return "VideoXXX";
};
var _movie = new Movie();
(function (parent, child) {
for (var ele in parent) {
if (!child[ele]) //在child不包含該屬性或者方法的時候，才會拷貝parent的一份
child[ele] = parent[ele];
}
})(_video, _movie); //匿名函數(shù)調(diào)用的方式
alert(_movie.size); //3
alert(_movie.toString()); //[object Object]
alert(_movie.getName()); //VideoXXX
三個alert都有結(jié)果，說明了匿名函數(shù)內(nèi)部執(zhí)行了。
這篇文章主要介紹了JavaScript中的Math.LOG2E屬性使用詳解,是JS入門學習中的基礎知識,需要的朋友可以參考下
2015-06-06 
這篇文章主要介紹了JavaScript中的fontsize()方法使用詳解,是JS入門學習中的基礎知識,需要的朋友可以參考下
2015-06-06 
如果在使用javascript的時候涉及到event處理，就需要知道event在不同的瀏覽器中的差異，主要的JavaScript的事件模型有三種（參考《Supporting Three Event Models at Once》），它們分別是NN4、IE4+和W3C/Safar。
2014-06-06 
ECMA-262中描述了一組具有特定用途的關鍵字，關鍵字屬于語言保留，不可以用于標示符，學習js的朋友可以看看
2014-10-10 
javascript使用window.open提示“已經(jīng)計劃系統(tǒng)關機”的原因
這篇文章主要介紹了javascript使用window.open提示“已經(jīng)計劃系統(tǒng)關機”的原因,本文得出結(jié)論是安裝了系統(tǒng)更新或其它原因,要把系統(tǒng)重啟時才會提示這個問題,所以,遇到這個問題,重啟你的電腦吧
2014-08-08 
淺談JavaScript數(shù)據(jù)類型及轉(zhuǎn)換
本文向大家簡單介紹了javascript的數(shù)據(jù)類型以及他們直接的轉(zhuǎn)換方法，雖然沒有太多示例，但是也是個人的一些經(jīng)驗總結(jié)，這里推薦給大家。
2015-02-02 
javascript typeof id===''string''?document.getElementById(id
剛開始學習js的朋友可能會有些疑問，其實這段代碼使用js的三元運算符，這樣代碼看起來高大上，最主要是代碼段少
2016-11-11 
淺談javascript構(gòu)造函數(shù)與實例化對象
JavaScript 中的構(gòu)造函數(shù)和其它語言中的構(gòu)造函數(shù)是不同的。
通過 new 關鍵字方式調(diào)用的函數(shù)都被認為是構(gòu)造函數(shù)。任何JavaScript 函數(shù)都可以用做構(gòu)造函數(shù)，構(gòu)造函數(shù)必須
使用new 運算符作為前綴來創(chuàng)建新的實例。
2015-06-06 
這篇文章主要介紹了使圖片旋轉(zhuǎn)的3種解決方案,并了幾個方法的對比，大家參考看一下吧
2013-11-11