// 作用域和自由变量 // 闭包 let i,a for(i=0;i<10;i++){ a=document.createElement('a'); a.innerHTML = i + '<br>' a.addEventListener('click',function(e){ e.preventDefault() alert(i) //10 }) document.body.appendChild(a) } // 作用域:就是一个变量的合法使用范围,如果在作用域外使用变量,就会报错 let b=0; function fn1(){ let b1=100 function fn2(){ let b2 = 200 function f3(){ let b3 = 300 return b+b1+b2+b3 } return f3() } console.log(b2) //b2 is not defined return fn2() } console.log(fn1()) // 作用域:全局作用域 // 函数作用域 // 块级作用域(ES6) if(true){ let x=100 } console.log(x) // 自由变量:一个变量在当前作用域没有定义,但是被使用了 // 向上级作用域一层一层依次寻找,直到找到为止 // 如果全局作用域都没找到,就报错xx is not defined
let b=0;
function fn1(){
let b1=100
function fn2(){
let b2 = 200
function f3(){
let b3 = 300
return b+b1+b2+b3
}
return f3()
}
console.log(b2) //b2 is not defined
return fn2()
}
console.log(fn1())
// 所有自由变量的查找是在函数定义的地方向上级作用域查找,不是在执行的地方!! // 闭包:作用域应用的特殊情况,有两种表现:(跟上面的例子不一样,上面的例子是函数定义在哪儿在哪儿被执行,闭包是函数定义的地方和函数执行的地方不一样) // 函数作为参数被传递: function print(fn1){ var bb=200 fn1() } var bb=100 function fn1(){ console.log(bb) } print(fn1) // 函数作为返回值被返回值 function create(){ let aa=100 return function(){ console.log(aa) } } let fn = create() let aa =200 fn()
2.闭包的应用
// 闭包:隐藏数据,只对外提供和API function createCache(){ const data={} //闭包中的数据被隐藏,不被外界访问 return { set:function(key,val){ data[key] = val }, get:function(key){ return data[key] } } } const c = createCache() c.set('a',1) console.log(c.get('a'))