对匿名函数的深刻理解（完全版）

从简单的字面理解就是一个没有名字的函数，可是若是说它只是这样简单，那我也就没有必要来讲这些。

对匿名函数的理解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)
}()