在理解闭包前,先对JS中的全局和局部变量做一个回顾
全局变量:可重用性好,任意地方都可使用,易被污染。局部变量:仅函数内可用不惯,不易被污染,可重用性差。
全局与局部变量案例
var a = 100 //全局变量
function foo(){
var a = 200 //局部变量
a--; //全局与局部变量重名,局部优先
console.log(a) //输出局部变量的值 199
}
foo()
console.log(a) //访问的是全局变量,函数内部定义变量访问不到 输出100
//如果再这此重新定一个var a = 300,原先的全局变量将被覆盖(污染)
闭包简介
为保证一个函数内部的变量既可以得到复用,又不会被随意篡改(污染)
设计步骤
定义外部函数,用于封装要保护的变量及可外部访问的内部函数定义外部函数中受保护的变量及用于操作保护变量的内部函数,并将内部函数返回调用外部函数获取内部函数,然后基于内部函数操作受保护对象
代码
function outer(){
var count = 10
//这个变量外部不可访问
return function(){
count++
//通过内部函数操作受保护变量
console.log(count)
}
}
var inner = outer()
//调用外部函数获取内部函数
inner()
//调用内部函数操作受保护变量 输出11
inner()
//输出12
inner()
//输出13
支付案例
function moneyBag(){
//外层函数
var totalMoney = 100
//受保护变量
return function(money){
//内层函数
if(totalMoney < money){
console.log('余额不足')
return
}
totalMoney-= money
//在内层函数中操作受保护变量
console.log(`支付${money}元,剩余${totalMoney}元`)
}
}
var pay = moneyBag()
//调用外层含糊
pay(10)
//调用内层函数 输出支付10元,剩余90元