Javascript 函数声明选项

Question

我见过专家使用下面的方法来声明一个函数:

(function () {
  function f(n) {
        // Format integers to have at least two digits.
        return n < 10 ? '0' + n : n;
    }
  //etc

}());

例如 https://github.com/douglascrockford/JSON-js/blob/master/json.js

谁能帮我理解我们什么时候应该使用上面的模式以及我们如何使用它？

谢谢。

Answer 1

嗯，由于 ECMA6 尚未到来，函数是在 JS 中创建作用域的最佳方式。如果在 IIFE(立即调用的函数表达式)中包装各种变量声明，则不会全局创建该变量。函数声明也是如此。
如果您被赋予了清除所有全局变量的脚本这一看似艰巨的任务，那么您需要做的就是将整个脚本包装在一个简单的 (function(){/*script here*/}()); 中。 ，并且没有创建全局变量，以免它们是隐含的全局变量，但这只是一个懒惰的修复。这种模式非常强大。

我已经更详细地解释了 IIFE 的使用 here , here和 here

基本的 JS 函数调用 live-cycle 的工作方式如下:

f();//call function
 ||
 ====> inside function, some vars are created, along with the arguments object
        These reside in an internal scope object
     ==> function returns, scope object (all vars and args) are GC'ed

与 JS 中的所有对象一样，一旦对象不再被引用，该对象就会被标记为 GC(垃圾收集)。但请考虑以下几点:

var foo = (function()
{
    var localFoo = {bar:undefined};
    return function(get, set)
    {
        if (set === undefined)
        {
            return localFoo[get];
        }
        return (localFoo[get] = set);
    }
}());

当 IIFE 返回时，foo 被赋予它的返回值，这是另一个函数。现在 localFoo 是在 IIFE 的范围内声明的，没有办法直接访问那个对象。乍一看，您可能认为 localFoo 会被 GC。
但是等等，正在返回的函数(并分配给 foo 仍然引用该对象，所以它不能被 gc'ed。换句话说:作用域对象比函数调用还长，并创建一个闭包。

然后，localFoo 对象将不会被 GC，直到变量 foo 超出范围或重新分配另一个值以及对返回函数的所有引用迷路了。

查看其中一个链接的答案(带有图表的那个)，在该答案中有一篇文章的链接，我从那里窃取了我使用的图像。如果还没有的话，这应该会为您解决问题。

IIFE 可以不返回任何内容，但无论如何都会公开其范围:

var foo = {};
(function(obj)
{
    //obj references foo here
    var localFoo = {};
    obj.property = 'I am set in a different scope';
    obj.getLocal = function()
    {
        return localFoo;
    };
}(foo));

此 IIFE 不返回任何内容(暗示 undefined)，但 console.log(foo.getLocal()) 将记录空对象文字。 foo 本身也将被分配 property。但是等等，我可以帮你做得更好。假设 foo 已经通过上面的代码一次:

var bar = foo.getLocal();
bar.newProperty = 'I was added using the bar reference';
bar.getLocal = function()
{
    return this;
};
console.log(foo.getLocal().newProperty === bar.newProperty);
console.log(bar ==== foo.getLocal());
console.log(bar.getLocal() === foo.getLocal().getLocal());
//and so on

这个日志会是什么？实际上，它会一次又一次地记录 true。在 JS 中，对象从不被复制，它们的引用被复制，但对象总是相同的。在某个范围内更改一次，这些更改将在所有引用之间共享(逻辑上)。
这只是为了向您展示闭包一开始可能很难让您头脑清醒，但这也展示了它们可以的强大之处:您可以通过各种 IIFE 传递一个对象，每次都设置一个新的可以访问其他方法无法访问的自己的独特范围的方法。

注意
Closers 对于 JS 引擎来说并不是那么容易进行垃圾收集，但是 lately, that's not that big of an issue anymore .
也花点时间用谷歌搜索这些条款:

• JavaScript 中的模块模式 Some reasons WHY we use it
• JavaScript 中的闭包 Second hit
• JavaScript 函数范围 First hit
• JavaScript 函数上下文 The dreaded this reference

IIFE 也可以命名为函数，但是唯一可以引用该函数的地方是在该函数的作用域内:

(function init (obj)
{
    //obj references foo here
    var localFoo = {};
    obj.property = 'I am set in a different scope';
    obj.getLocal = function()
    {
        return localFoo;
    };
    if (!this.wrap)
    {//only assign wrap if wrap/init wasn't called from a wrapped object (IE foo)
        obj.wrap = init;
    }
}(foo));
var fooLocal = foo.getLocal();
//assign all but factory methods to fooLocal:
foo.wrap(fooLocal);
console.log(fooLocal.getLocal());//circular reference, though
console.log(init);//undefined, the function name is not global, because it's an expression

这只是一个基本示例，说明如何使用闭包创建包装器对象...