1.闭包:闭包是指有权访问另一个函数作用域中变量的函数
(也可以理解为可以读取其它函数内部变量的函数)
function foo(){
var name = 'hello world'; //name是一个被init创建的局部变量
return function sayName() { //sayName是一个内部函数,闭包
console.log(name); //使用了父级函数声明的变量name
}
}
var f = foo();
f();
2.闭包的两大用处
- (1)可以读取函数内部的变量
- (2)让变量的值始终保持在内存中,不会在被外部函数调用后自动删除。正常函数执行完毕后,里面声明的变量被垃圾回收处理掉,但是闭包可以让作用域里的变量,在函数执行完之后依旧保持没有被垃圾回收处理掉。
3.闭包的优点:
- 避免长期驻扎在内存中
- 避免全局变量的污染
- 私有成员的存在
4.闭包的缺点:不合理的使用会造成内存泄漏
5.闭包的应用:
在循环中使用闭包
// 如何实现输出0-5?
for(var i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i); //输出 55555
},1000*i);
}
// 方法一 ,makeCallback函数为每一个回调创建一个新的词法环境
function makeCallback(i){
return function() {
console.log(i);
}
}
for(var i=0; i<10; i++) {
setTimeout(makeCallback(i),1000)
}
// 方法二,使用匿名闭包
for(var i=0; i<10; i++) {
(function(i){
setTimeout(function(){
console.log(i);
},1000)
})(i)
}
6.闭包总结:
- (1)局部变量无法共享和长期保存,而全局变量可能造成变量污染,当我们希望有一种机制即可以长久保存变量又不会造成全局污染。
- (2)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄漏。解决方法是,在退出函数之前,将不在使用的局部变量全部删除。
- (3)闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象来使用,把 闭包当作公共方法,把内部变量当作它的私有属性,这时一定要小心,不要随便改变父函数内部变量的值。
<div class="nav">
<li>苹果</li>
<li>香蕉</li>
<li>梨子</li>
<li>菠萝</li>
<div>
<script>
var list = document.querySelector('.nav').querySelectorAll('li');
for (var i = 0; i < list.length; i++) {
(function(i) {
list[i].onclick = function() {
console.log(i);
}
})(i)
}
</script>