初学者对JavaScript匿名函数使用的理解

时间:2022-11-03 19:14:40

JavaScript中的函数对于初学者那是相当难理解,比如说我。而它又是相当的强大。使用起来非常灵活和怪异。

函数在js中可以写成两种形式:函数声明和函数表达式。

函数声明和其他语言一样:

function funcName (){
    alert("Hello World");
}

函数表达式的写法是把匿名函数付给一个变量。匿名函数就是function后面不加函数名。

var funcName = function(){
    alert("Hello World");
}

js中函数的怪异和强大之处就在匿名函数。可以把匿名函数当做属性或变量使用。所以会出现很多怪异的写法。来看这个例子:

    var func = function(){
        return function(){
            alert("Hello World");
        };
    };
    func()();

我刚看到函数后面跟两个括号时马上晕了。分开来分析:

首先,有一个匿名函数

function(){
        return function(){
            alert("Hello World");
        };
    }

把它当做对象,赋给func。此时执行func() 相当于执行上面这个匿名函数。

这个匿名函数的返回值又是一个匿名函数。所以执行func()的返回值其实是一个函数

function(){
            alert("Hello World");
        }

所以func()()是执行上面这个函数,屏幕上弹出“Hello World”。

其实,这么写会有助于理解

    var func = function(){
        var newfunc = function(){
            alert("Hello World");
        };
        return newfunc;
    };
    var returnFunc = func();
    returnFunc();

再看一个更变态的

    var func = function(text){
        return function(){
            return text;
        }
    };
    var newFunction = function(text){
        alert(text);
    };
    newFunction(func("hello world")());

能看懂这些变态的代码还是很有意义的。因为在一些框架和模块的使用中经常会碰到变态的代码。

当真正理解“函数是对象”后,就不会觉得这些代码变态了,而会觉得他们很强大。