我正在尽最大努力理解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();
当前回答
我曾经写过一篇关于如何使用闭包来简化事件处理代码的文章。它比较ASP。NET事件处理到客户端jQuery。
http://www.hackification.com/2009/02/20/closures-simplify-event-handling-code/
其他回答
如果你熟悉面向对象意义上的实例化类的概念(即创建该类的对象)，那么你就接近理解闭包了。
这样想:当你实例化两个Person对象时，你知道类成员变量“Name”在实例之间是不共享的;每个对象都有自己的“副本”。类似地，当你创建一个闭包时，自由变量(上面例子中的'calledCount')被绑定到函数的'实例'。
我认为你的概念上的突破有点受到这样一个事实的阻碍，即由warnUser函数(另外:这是一个高阶函数)返回的每个函数/闭包都绑定'calledCount'与相同的初始值(0)，而通常在创建闭包时，将不同的初始化式传递到高阶函数中更有用，就像将不同的值传递给类的构造函数一样。
所以，假设当'calledCount'达到某个值时，你想结束用户的会话;您可能需要不同的值，这取决于请求是来自本地网络还是来自大的坏Internet(是的，这是一个人为的例子)。要实现这一点，您可以将不同的calledCount初始值传递给warnUser(即-3或0?)
文献的部分问题是用来描述它们的命名法(“词汇范围”，“自由变量”)。不要让它欺骗你，闭包比看起来要简单得多…初步证据;-)
在这里，我有一句想说好几遍的问候语。如果我创建一个闭包，我可以简单地调用该函数来记录问候语。如果我不创建闭包，我必须每次都传递我的名字。
没有闭包(https://jsfiddle.net/lukeschlangen/pw61qrow/3/):
function greeting(firstName, lastName) {
var message = "Hello " + firstName + " " + lastName + "!";
console.log(message);
}
greeting("Billy", "Bob");
greeting("Billy", "Bob");
greeting("Billy", "Bob");
greeting("Luke", "Schlangen");
greeting("Luke", "Schlangen");
greeting("Luke", "Schlangen");
使用闭包(https://jsfiddle.net/lukeschlangen/Lb5cfve9/3/):
function greeting(firstName, lastName) {
var message = "Hello " + firstName + " " + lastName + "!";
return function() {
console.log(message);
}
}
var greetingBilly = greeting("Billy", "Bob");
var greetingLuke = greeting("Luke", "Schlangen");
greetingBilly();
greetingBilly();
greetingBilly();
greetingLuke();
greetingLuke();
greetingLuke();
每个人都解释了闭包的实际用例:定义和几个例子。
我想贡献一个闭包用例列表:
假设你想计算按钮被点击的次数;封闭是最好的选择。 节流和反弹 局部套用 记住 在异步世界中维护状态 函数就像一次 settimeout 迭代器
闭包有各种各样的用例。在这里，我将解释闭包概念的最重要的用法。
闭包可以用来创建私有方法和变量，就像面向对象的语言，如java、c++等。一旦你实现了私有方法和变量，你在函数中定义的变量将不能被窗口对象访问。这有助于数据隐藏和数据安全。
const privateClass = () => {
let name = "sundar";
function setName(changeName) {
name = changeName;
}
function getName() {
return name;
}
return {
setName: setName,
getName: getName,
};
};
let javaLikeObject = privateClass(); \\ similar to new Class() in OOPS.
console.log(javaLikeObject.getName()); \\this will give sundar
javaLikeObject.setName("suresh");
console.log(javaLikeObject.getName()); \\this will give suresh
另一个关于闭包的现实例子:
创建index . html:
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Program with Javascript</title>
</head>
<body>
<p id="first"></p>
<p id="second"></p>
<button onclick="applyingConcepts()">Click</button>
<script src="./index.js"></script>
</body>
</html>
2)在index.js:
let count = 0;
return () => {
document.getElementById("first").innerHTML = count++;
};
})();
在本例中，当您单击一个按钮时，计数将在p#id上更新。 注意:您可能想知道这段代码有什么特别之处。检查时，您将注意到不能使用window对象更改count的值。这意味着你已经声明了私有变量count，这样可以防止你的状态被客户端破坏。
闭包是一种创建生成器的有用方法，它是一个按需递增的序列:
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基础知识:功能
