闭包是一种创建生成器的有用方法，它是一个按需递增的序列:

var foobar = function（i）{var count = count || i; return function（）{return ++count;}} 巴兹 = 福巴（1）; console.log（“First Call： ” + baz（））;2 console.log（“第二次调用： ” + baz（））;3

区别总结如下:

Anonymous functions                                    Defined functions

Cannot be used as a method                             Can be used as a method of an object

Exists only in the scope in which it is defined        Exists within the object it is defined in

Can only be called in the scope in which it is defined Can be called at any point in the code

Can be reassigned a new value or deleted               Cannot be deleted or changed

参考文献

AS3基础知识:功能

在Mozilla开发者网络上有一个关于实用闭包的章节。

我已经使用闭包做了如下的事情:

a = (function () {
    var privatefunction = function () {
        alert('hello');
    }

    return {
        publicfunction : function () {
            privatefunction();
        }
    }
})();

正如你在那里看到的，a现在是一个对象，它有一个方法publicfunction(a.publicfunction())，它调用privatefunction，它只存在于闭包中。你不能直接调用privatefunction(即a.b ratefunction())，只能调用publicfunction()。

这是一个最小的例子，但也许你可以看到它的用途?我们使用它来强制公共/私有方法。

闭包的另一个常见用途是将方法中的this绑定到特定对象，允许在其他地方调用它(例如作为事件处理程序)。

function bind(obj, method) {
    if (typeof method == 'string') {
        method = obj[method];
    }
    return function () {
        method.apply(obj, arguments);
    }
}
...
document.body.addEventListener('mousemove', bind(watcher, 'follow'), true);

每当鼠标移动事件触发时，都会调用watch .follow(evt)。

闭包也是高阶函数的重要组成部分，通过参数化不同部分，可以将多个相似函数重写为一个高阶函数，这是非常常见的模式。举个抽象的例子，

foo_a = function (...) {A a B}
foo_b = function (...) {A b B}
foo_c = function (...) {A c B}

就变成了

fooer = function (x) {
    return function (...) {A x B}
}

其中A和B不是语法单位，而是源代码字符串(不是字符串字面量)。

具体示例请参见“用函数简化我的javascript”。

这里我有一个闭包概念的简单例子，我们可以在我们的电子商务网站或其他许多网站上使用它。

我正在添加示例的JSFiddle链接。它包含一个由三种商品组成的小产品清单和一个购物车柜台。

JSFiddle

// Counter closure implemented function; var CartCouter = function(){ var counter = 0; function changeCounter(val){ counter += val } return { increment: function(){ changeCounter(1); }, decrement: function(){ changeCounter(-1); }, value: function(){ return counter; } } } var cartCount = CartCouter(); function updateCart() { document.getElementById('cartcount').innerHTML = cartCount.value(); } var productlist = document.getElementsByClassName('item'); for(var i = 0; i< productlist.length; i++){ productlist[i].addEventListener('click', function(){ if(this.className.indexOf('selected') < 0){ this.className += " selected"; cartCount.increment(); updateCart(); } else{ this.className = this.className.replace("selected", ""); cartCount.decrement(); updateCart(); } }) } .productslist{ padding: 10px; } ul li{ display: inline-block; padding: 5px; border: 1px solid #DDD; text-align: center; width: 25%; cursor: pointer; } .selected{ background-color: #7CFEF0; color: #333; } .cartdiv{ position: relative; float: right; padding: 5px; box-sizing: border-box; border: 1px solid #F1F1F1; } <div> <h3> Practical use of a JavaScript closure concept/private variable. </h3> <div class="cartdiv"> <span id="cartcount">0</span> </div> <div class="productslist"> <ul> <li class="item">Product 1</li> <li class="item">Product 2</li> <li class="item">Product 3</li> </ul> </div> </div>

是的，这是一个有用闭包的好例子。对warnUser的调用在其作用域中创建calledCount变量，并返回一个匿名函数，该函数存储在warnForTamper变量中。因为仍然有一个使用calledCount变量的闭包，所以在函数退出时不会删除它，所以每次调用warnForTamper()都会增加作用域变量并提醒该值。

我在Stack Overflow上看到的最常见的问题是，有人想要“延迟”使用在每次循环中增加的变量，但因为变量是有作用域的，所以对变量的每次引用都是在循环结束后，导致变量的结束状态:

for (var i = 0; i < someVar.length; i++)
    window.setTimeout(function () {
        alert("Value of i was "+i+" when this timer was set" )
    }, 10000);

这将导致每个警报都显示相同的i值，即循环结束时它增加到的值。解决方案是创建一个新的闭包，一个变量的独立作用域。这可以使用一个立即执行的匿名函数来完成，该函数接收变量并将其状态存储为参数:

for (var i = 0; i < someVar.length; i++)
    (function (i) {
        window.setTimeout(function () {
            alert("Value of i was " + i + " when this timer was set")
        }, 10000);
    })(i);