<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 闭包</h1>
<p>使用局部变量计数。</p>
<button type="button" onclick="myFunction()">计数!</button>
<p id="demo">0</p>
<script>
var add = (function () {
var counter = 0;
return function () {counter += 1; return counter;}
})();
function myFunction(){
document.getElementById("demo").innerHTML = add();
}
</script>
</body>
</html>
var add = (function () {
var counter = 0;
return function () {counter += 1; return counter;}
})();
这个的意思,是把外面这个匿名函数的运行结果赋值给add,也就是说这个函数只在赋值的时候执行一次(这也意味着var counter = 0;只执行了一次),以后调用add时,实际运行的就是里面的这个function () {counter += 1; return counter;}函数,所以couter不会归零,会继续累加下去。
你用console.log(add);把add打印到控制台就知道是怎么回事了: