我正在尽最大努力理解JavaScript闭包。
通过返回一个内部函数，它可以访问直接父函数中定义的任何变量。
这对我有什么用?也许我还没完全搞清楚。我在网上看到的大多数示例都没有提供任何真实的代码，只是一些模糊的示例。
有人能告诉我一个闭包的真实用法吗?
比如这个吗?
var warnUser = function (msg) {
var calledCount = 0;
return function() {
calledCount++;
alert(msg + '\nYou have been warned ' + calledCount + ' times.');
};
};
var warnForTamper = warnUser('You can not tamper with our HTML.');
warnForTamper();
warnForTamper();
当前回答
闭包是一种创建生成器的有用方法，它是一个按需递增的序列:
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基础知识:功能
其他回答
我已经使用闭包做了如下的事情:
a = (function () {
var privatefunction = function () {
alert('hello');
}
return {
publicfunction : function () {
privatefunction();
}
}
})();
正如你在那里看到的，a现在是一个对象，它有一个方法publicfunction(a.publicfunction())，它调用privatefunction，它只存在于闭包中。你不能直接调用privatefunction(即a.b ratefunction())，只能调用publicfunction()。
这是一个最小的例子，但也许你可以看到它的用途?我们使用它来强制公共/私有方法。
在Mozilla开发者网络上有一个关于实用闭包的章节。
我曾经写过一篇关于如何使用闭包来简化事件处理代码的文章。它比较ASP。NET事件处理到客户端jQuery。
http://www.hackification.com/2009/02/20/closures-simplify-event-handling-code/
这里我有一个闭包概念的简单例子，我们可以在我们的电子商务网站或其他许多网站上使用它。
我正在添加示例的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>
特别是在JavaScript(或任何ECMAScript)语言中，闭包在隐藏功能实现的同时仍然显示接口方面非常有用。
例如，假设您正在编写一个日期实用工具方法类，您希望允许用户通过索引查找工作日名称，但不希望他们能够修改您在底层使用的名称数组。
var dateUtil = {
weekdayShort: (function() {
var days = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
return function(x) {
if ((x != parseInt(x)) || (x < 1) || (x > 7)) {
throw new Error("invalid weekday number");
}
return days[x - 1];
};
}())
};
注意，days数组可以简单地存储为dateUtil对象的属性，但是脚本用户可以看到它，他们甚至可以根据需要更改它，甚至不需要您的源代码。但是，由于它被返回日期查找函数的匿名函数所包围，因此只能由查找函数访问，因此现在它是防篡改的。
