對匿名函數的深刻理解（完全版）

從簡單的字面理解就是一個沒有名字的函數，可是若是說它只是這樣簡單，那我也就沒有必要來講這些。

對匿名函數的理解1：

function(){
    console.log(1); 
}
// 報錯

不能直接使用。

對匿名函數的理解2：

var a = function(){
    console.log(1);
}
a(); //1

匿名函數能夠依附於一個變量，而且這個變量名就是這個匿名函數的名字。

var a = function(){
    console.log(1);
}
console.log(typeof a); //function

對匿名函數的理解3：

window.onload = function(){
    console.log("匿名函數");
}
// 匿名函數

當匿名函數用在綁定事件中的時候，當這個事件執行的時候這個匿名函數也會被執行。

對匿名函數的理解4：

(function(){
    console.log("追夢子");
})()
// 追夢子

若是將匿名函數放入到表達式中而且後面加上小括號會自動執行這個函數

對匿名函數的理解5：

var a = function(){
    console.log("自執行函數");
}();
// 自執行函數

匿名函數後面加括號會執行這個函數。

對匿名函數的理解6：

function(){
    console.log(1);
}();
// 報錯

匿名函數必須依附一個變量。

對匿名函數的理解7：

var a = {
    fn:function(){
        console.log(1);
    }
}
a.fn(); //1

匿名函數不僅是能夠依附於一個變量，也能夠依附於一個對象的屬性。

對匿名函數的理解8：

var a = {
    fn:function(){
        console.log("追夢子");
    }()
} //追夢子

一樣的匿名函數當作一個對象的屬性時也能夠自調用。

對匿名函數的理解9：

var a = function(b){
    console.log(b)
}
a(52); //52

匿名函數也能夠傳遞參數

對匿名函數的理解10：

(function(a){
    console.log(a);
})(10) //10

對於表達式函數一樣也能夠傳遞參數

對匿名函數的理解11：

var a = function(b){
    console.log(b);
}(10); //10
console.log(a); //undefined

若是將一個自執行的匿名函數而且沒有返回值，賦值給一個變量那麼這個變量的值就是undefined。由於這個函數在賦值以前已經執行完了，而這個函數沒有返回值，因此就是undefined，若是有返回值，那麼這個變量的值就是那個匿名函數的返回值。

var a = function(b){
    return b;
}(10);
console.log(a); //10

 

這裏對匿名函數的講解就到此結束，下面說一下關於自執行的匿名函數問題。

why？爲何下面這段代碼會報錯？

function(){
    console.log(1);
}
// 報錯

　　一、由於ECAMScript規定函數的聲明必需要有名字，若是沒有名字的話，咱們就沒有辦法找到它了，對於爲何自執行函數爲何就能夠不帶名字後面會講。

　　二、若是沒有名字必需要有一個依附體，如：將這個匿名函數賦值給一個變量。

若是按照上面的說法js報錯也是應該的，那麼咱們用的下面這種代碼爲何就可以正常運行？

(function(){
    console.log(1);
})() //1

　　之因此能夠是由於咱們將這個函數包含在了一個小括號中，why？小括號爲何這麼神奇？

按照ECAMScript的規定，函數聲明是必需要有名字的，可是咱們用括號擴起來那麼這個函數就再也不是一個函數聲明瞭，而是一個函數表達式，你能夠理解成下面這段代碼。

var a = function(){
    console.log(1);
}(); //1

　　將一個匿名函數賦值給一個變量或者對象屬性就是函數表達式，函數表達式是能夠不須要名字的，因此咱們就能夠直接經過這種方式來自動的執行這個函數。

再說一句

(function(){
    ....
})()

第一個括號是個運算符，它會返回這個匿名函數，而後最後一個小括號會執行這個函數。

總結也就是說只要是表達式就能夠直接執行它，而且不須要函數名，那麼咱們還能夠這樣調用它。

-function(){
    console.log(1);
}()
+function(){
    console.log(2);
}()
~function(){
    console.log(3);
}()
!function(){
    console.log(4);
}()
&function(){
    console.log(5);
}()
|function(){
    console.log(6);
}()
/function(){
    console.log(7);
}()
/function(){
    console.log(8)
}()
%function(){
    console.log(9)
}()
typeof function(){
    console.log(10)
}()
null==function(){
    console.log(11)
}()
0==function(){
    console.log(12)
}()
0!=function(){
    console.log(13)
}()
0>function(){
    console.log(14)
}()
0<function(){
    console.log(15)
}()
0-function(){
    console.log(16)
}()