一、闭包是什么?
首先,我们要明确闭包的概念,这里引用百度百科的概念
闭包就是能够读取其他函数内部变量的函数。例如在javascript中,只有函数内部的子函数才能读取局部变量,所以闭包可以理解成“定义在一个函数内部的函数“。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。
[1]
简而言之,就是包在函数里面的函数,形成一个闭环,里面的函数可以访问到父函数的变量,函数可以作为另一个函数的返回值,也可以作为参数
- 第一种,作为参数
function fn1(fn){
const a = 100
fn()
}
const a = 200
function fn(){
console.log(a)
}
fn1(fn)
-第二种作为返回值
function demo(){
let a = 100
return function(){
console.log(a)
}
}
let a = 200
demo()
二、手写一个简单的闭包
代码如下(示例):
function sum(a){
return function sum2(b){
return a+b
}
}
var l=sum(1)(2) //传参
console.log(l);
2.小案例
代码如下(示例):
错误示范案例
function sum() {
//var没有自己的作用域块,所以每一循环都会覆盖前面的值
for (var index = 0; index < 5; index++) {
//定定时器循环是异步编程, 每一轮循环设置定时器, 无需等定时器触发执行, 继续下一轮循环。
// (定时器触发的时候,循环已经结束); 5次循环都已经结束了,
// 设置了5次定时器, 循环已经结束, 定时器还没有开始。
// 循环结束 i = 5;
setTimeout(() => {
console.log(index);
}, 1000);
}
}
var l = sum()
console.log(l); //输出5 5 5 5 ,因为这里的index用的是var ,
//每次循环不会保存相应的值,可以换成let块级变量,就会输出1 2 3 4
//这是闭包的写法
function sum() {
//var没有自己的作用域块,所以每一循环都会覆盖前面的值
for (var index = 1; index < 5; index++) {
//嵌套函数
(function(j){
setTimeout(function a(){
console.log(j);
}, j*1000)
})(index)
//这里的index是记录的每次循环的值,会赋值给j
}
}
var l = sum()
console.log(l);
//输出1 2 3 4
//用let来实现,let有自己的作用域块,将重新绑定到每一次的迭代中,每次循环都会重新赋值
function sum() {
for (let index = 1; index < 5; index++) {
//嵌套函数
setTimeout(function a(){
console.log(index);
}, index*1000)
//这里的index是记录的每次循环的值,会赋值给j
}
}
var l = sum()
console.log();
//输出1 2 3 4
总结
闭包很简单,认真分析总会能行的