闭包
闭包用于解决，外部函数访问不到内部函数的变量，借助内部函数可以访问到外部函数的变量的特性。就是函数嵌套函数，如下。
代码解释：
function outerFun() {
let a = 10;
function innerFun() {
console.log(a);
}
return innerFun;
}
let res = outerFun();
res();
输出：10。
这就是函数嵌套函数，内部函数是闭包。内部函数的变量可以访问外部函数的变量a，所以可以输出10。
正常情况下，函数执行完毕，内存变量会销毁，也就是释放内存空间，那么就不会把输出结果10，而是输出undefined或者报错
那为什么上面还会输出结果呢？
因为闭包函数就是建立在函数内部的，内部函数没有执行完成，在上面的代码中，内部函数innerFun作为返回值被赋值给了res，内部函数innerFun并没有执行完成，外部函数变量就不会被销毁，它可以访问到外层函数的变量，所以就会导致外层函数执行完毕时，它的作用域不会被销毁。直到闭包函数也不存在。
闭包代码片段
- 每次外部函数执行的时候，都会开辟一块内存空间，外部函数的地址不同，都会重新创建一个新的地址：
function outerFn(){
var i = 0;
function innerFn(){
i++;
console.log(i);
}
return innerFn;
}
var inner = outerFn(); //每次外部函数执行的时候,都会开辟一块内存空间,外部函数的地址不同，都会重新创建一个新的地址
inner();
inner();
inner();
var inner2 = outerFn();
inner2();
inner2();
inner2();
依次输出：1 2 3 1 2 3
var i = 0;
function outerFn(){
function innnerFn(){
i++;
console.log(i);
}
return innnerFn;
}
var inner1 = outerFn();
var inner2 = outerFn();
inner1();
inner2();
inner1();
inner2();
inner1();
inner2(); //1 2 3 4 5 6
依次输出：1 2 3 4 5 6
闭包经典面试题
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i++);
}, 1000)
}
console.log(i);
先输出5，1秒后依次输出5，6，7，8，9。
function fnnn(){
var arr = [];
for(var i = 0;i < 5;i ++){
arr[i] = function(){
return i;
}
}
return arr;
}
var list = fnnn();
for(var i = 0,len = list.length;i < len ; i ++){
console.log(list[i]());
}
输出五个5。
防抖和节流就是两个典型的闭包案例
在进行窗口的resize、scroll，输入框内容校验等操作时，如果事件处理函数调用的频率无限制，会加重浏览器的负担，导致用户体验非常糟糕。此时我们可以采用debounce（防抖）和throttle（节流）的方式来减少调用频率，同时又不影响实际效果。
防抖是，当在一秒内快速多次点击按钮时，只执行最后一次点击的请求，有效的减少发送请求的次数。
如，在input输入框里快速输入时，取输入完成的结果发送请求，而不是从第一个字符就开始发送，这就是 “只执行最后一次点击的请求” 的意思。
<body>
<input type="text">
<script>
let input = document.querySelector('input')
function fun1() {
console.log('点击了！！！');
}
input.addEventListener('keyup', debounce(fun1, 1000))
function debounce(fn, delay) {
let timer = null;
return function () {
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
fun1()
}, delay)
}
}
</script>
</body>
节流是，控制事件执行次数，保证一定时间段内只调用一次事件处理函数。
如，滚动事件，少则一秒内发生几百次触发，非常消耗性能，利用闭包和定时器，可以保证执行次数。
函数执行的前提条件是，持续触发时，持续关闭开关，等到setTimeout到时间了，再把开关打开，函数就会执行了。
<style>
body {
height: 2000px;
}
</style>
window.onscroll = throttle(function () {
console.log('滚动啦！');
}, 1000)
function throttle(fn, delay) {
let valid = true;
return function () {
if (valid) {
setTimeout(() => {
// fn()
func.apply(this, arguments)
valid = true
}, 1000)
}
}
valid = false;
}
闭包代码理解参考：
闭包，看这一篇就够了——带你看透闭包的本质，百发百中
589
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
