JS闭包总结

闭包: 有权访问另一个函数作用域中变量的函数

用处: 1 读取函数内部的变量
         2 让某些变量的值始终保持在内存中

在了解闭包之前,我们需要明白变量的作用域,即函数内部能够读取全局变量,但是函数外却不能读取函数内的局部变量

1 当使用闭包访问局部变量

function f1(){
    var n = 999;
    function f2(){
      alert(n);
    }
    return f2;
}
var result = f1();
result();   // 999

此时f2就是闭包

2 累加

 2.1 使用全局变量累加

 var num = 1;
 function add(){
    num++;
 }
 alert(num);   //1
 add();
 alert(num);   //2
 add();
 alert(num);  //3

可以达到想要的效果,但是因此带来的是全局污染

 2.2 使用局部变量累加

 function add(){
    var num =1;
    num++;
    return num;
 }
 alert(add()); //2
 alert(add()); //2

输出的结果每次都是2是因为每次执行add函数时,num又被初始化了

2.3 使用闭包累加

  function add(){
    var num = 1;
    return function(){
        num++;
        return num;
    }
  }
  var b= add();
  alert(b()); //2
  alert(b()); //3

在没有使用全局变量的情况下,也能实现累加,这里值得注意的点是:最后是把add()赋值给变量b;而不是直接alert(add()());这里是可以防止num再一次初始化;

*补充一个直接调用与调用闭包的例子

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
        function f1(){
            var n = 999;
            return function(){
                n++;
                alert(n);
            };
        }
        
//直接调用
//      f1()(); 1000
//      f1()(); 1000
//      f1()(); 1000
        
//调用闭包
        var result = f1();
        result();  //1000
        result();  //1001
        result();  //1002
    </script>
</body>
</html>
原文地址:https://www.cnblogs.com/Tiboo/p/6885264.html