JavaScript基础-即时函数(Immediate Functions)(017)

1.即时函数的声明方法

即时函数（Immediate Functions）是一种特殊的JavaScript语法，可以使函数在定义后立即执行：
( function () {
    alert('watch out!');
} ());

下面分几部来理解这种写法：

1. 橙色部分是一个函数表达式；
2. 天蓝色的一对括号代表立即执行它，括号里是执行这个函数需要的参数（这个例子不需要参数）；
3. 再用一对括号（就是黑色的这一对）把上面的部分包起来。

黑色这一对括号可以让人明白这个表达式得到的是函数的返回值，而不是函数对象。许多人更喜欢下面的写法，效果与上面的完全相同：
( function () {
    alert('watch out!');
}) ();
2. 即时函数的应用场景
当你需要在程序启动时执行一些初始代码，这些初始化的工作只需要执行一次，而且当中用到的临时变量以后将不再有用，这时就可以把这些代码放到一个即时函数中执行：

(function () {
    var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
        today = new Date(),
        msg = 'Today is ' + days[today.getDay()] + ', ' + today.getDate();


    alert(msg);


}()); // "Today is Fri, 13"

3.即时函数的参数
下面的例子展示了一个带参数的即时函数：

// prints:
// I met Joe Black on Fri Aug 13 2010 23:26:59 GMT-0800 (PST)
(function (who, when) {
    console.log("I met " + who + " on " + when);
}("Joe Black", new Date()));

 有时，也可以把全局的this对象传给即时函数，这样就可以在不同的运行环境下复用即时函数中的代码：

(function (global) {
    // access the global object via `global`
}(this));

 当然，如果即时函数的参数比较多，而函数体又比较长的时候，你就需要上下来回的查看函数的参数列表定义和它的形参列表，这有时候挺烦人的。
4.即时函数的返回值
就如普通函数一样，即时函数也有返回值，可以把返回值赋给变量（注意，这里不是把函数对象赋值给变量）：

var result = (function () {
    return 2 + 2;
}());

如果把包在即时函数外的括号去掉，其效果完全相同。这种语法更简洁，但容易让人以为是把函数对象赋值给了变量，事实上变量得到的是函数的返回值： 

var result = function () {
    return 2 + 2;
}();

 由于上面提到，即时函数有两种写法，所以下面的代码在效果上，与上面的两种写法完全相同：
var result = (function () {
    return 2 + 2;
})();
这三个例子返回的都是原始数据类型。实际上即时函数可以返回任何数据，包括函数对象：

var getResult = (function () {
    var res = 2 + 2;
    return function () {
        return res;
    };
}());

 由于利用即时函数可以提供一段独立的局部作用域，最后还有返回值，所以也有人喜欢给对象的属性赋初始值的时候使用即时函数：

var o = {
    message: (function () {
        var who = "me",
            what = "call";
        return what + " " + who;
    }()),
    getMsg: function () {
        return this.message;
    }
};
// usage
o.getMsg(); // "call me"
o.message;  // "call me"

 上面的例子里，message是一个string类型的属性，而不是一个方法。
5. 即时函数的使用
即时函数提供局部的变量作用域，不会污染全局环境，同时其中的代码又能立即执行，所以经常用在模块化的程序中。如果我们把每一个功能 独立的代码段都用即时函数来组织，并放到一个单独的js文件中，那我们什么时候想使用，就把这个js文件引入进来就可以了：

// module1 defined in module1.js
(function () {
  // all the module 1 code ...
}());

 

http://zihui.lin.blog.163.com/blog/static/7292115420126335225160/

转载于:https://www.cnblogs.com/Bryran/p/3964751.html