1 <!DOCTYPE html> 2 <html> 3 <body> 4 5 <p>局部变量计数。</p> 6 7 <button type="button" onclick="myFunction()">计数!</button> 8 9 <p id="demo">0</p> 10 11 <script> 12 var add = (function () { 13 var counter = 0; 14 return function () {return counter += 1;} 15 })(); 16 17 function myFunction(){ 18 document.getElementById("demo").innerHTML = add(); 19 } 20 </script> 21 22 </body> 23 </html>
变量 add 指定了函数自我调用的返回字值。
自我调用函数只执行一次。设置计数器为 0。并返回函数表达式。
add变量可以作为一个函数使用。非常棒的部分是它可以访问函数上一层作用域的计数器。
这个叫作 JavaScript 闭包。它使得函数拥有私有变量变成可能。
计数器受匿名函数的作用域保护,只能通过 add 方法修改。
注意事项:
在这段代码中,
function () {return counter += 1;作为一个闭包,是能够访问 counter 值的,
这就是闭包是可访问上一层函数作用域里变量的函数,即便上一层函数已经关闭。