理解js中的闭包

什么是闭包？

闭包指的是那些引用了另一个函数作用域中变量的函数。
在调用一个函数时，会为这个函数创建一个执行上下文，并且创建一个作用域链，然后用arguments和其它命名参数来初始化这个函数的活动对象，我们可以通过作用域访问到 全局变量对象或函数对象上的变量。
函数执行时，每个上下执行文中都会有一个包含其中变量的对象。
全局上下文中叫变量对象，它会在代码执行期间始终存在。
函数局部上下文中的叫活动对象，只在函数执行期间存在。

为什么要使用闭包？

1. 想要访问函数内部的变量

function fn(){
   const num = 1
   function fn2(){
       console.log(num)
   } 
   fn2()
}
fn()//获取num的值

如果只是想要访问函数内部的变量，下面这种方法也能访问到函数内部变量，为什么不适用下面这种更简单、便捷的方法呢？

function fn(){
   const num = 1
   return num
}
fn()//获取num的值

2.维持一种状态，又不想造成全局污染

//全局变量销毁---页面关闭时
var num = 1
function fn(){
 num++
 console.log(num)
}
fn()//2
fn()//3
fn()//4
	

//局部变量销毁---在函数执行完毕后
function fn(){
 var num = 1
 num++
 console.log(num)
}
fn()//2
fn()//2
fn()//2

//闭包的写法1
function fn(){
   var num = 10
   function fn2(){
     num++
     console.log(num)
   }
   return fn2
 }
 var f1 = fn(); //fn执行的结果就是闭包
 var f2 = fn();
 var f3 = fn();
 f1()//11
 f1()//12
 f1()//13
 f2()//11
 f2()//12
 f3()//11

//闭包的写法2
function fn(){
  var num = 10
  return function(){
    num++
    console.log(num)
  }
 }
 var f1 = fn(); //fn执行的结果就是闭包
 var f2 = fn();
 var f3 = fn();
 f1()//11
 f1()//12
 f1()//13
 f2()//11
 f2()//12
 f3()//11

什么时候会使用闭包？

封装一些私有变量的时候
在Vue.js中就有许多地方使用到闭包。比如：vue中的data就是一种闭包的形式。

// 闭包作为回调函数,可以实现函数的复用。
  data(){
  	return{}
  }

总结

局部变量无法共享和长久保存，全局变量可能造成全局污染，闭包机制既可以长久保存变量又不会造成全局污染。