对JS闭包的简单理解,一学就会,一敲就废

131 阅读1分钟

闭包的定义:
闭包是指有权访问另一个函数作用域中的变量的函数。
闭包的特点:
1.函数中嵌套函数
2.函数内部可以引用函数外部的变量和参数
闭包的缺点:
闭包比普通函数占用的内存更大, 所以在不用的时候要关掉

常见的闭包函数

    for(var i=0; i<5;i++) {
            setTimeout(() => {
                console.log(i);
            }, 1000);
        }

打印结果是: 5个5
其实这就是比较典型的闭包造成的;因为定时器是处于异步的;而for循环是同步的;js的单线程运行机制;所以会先运行完循环以后再执行异步代码;就导致 i 输出的结果都是5
解决办法:
方法一 闭包:

for(var i=0; i<5;i++) {
		// 立即执行函数中接收一个值
            ((i)=>{	//	形参
                setTimeout(() => {
                console.log(i);
            }, 1000)
            })(i);	// 把 i 传进去
     }

打印结果:01234

方法二: let

 for(let i=0; i<5;i++) {
            setTimeout(() => {
                console.log(i);
            }, 1000)
        }

打印结果:01234

闭包函数:

function fn(){
        let status = 0
        function foo(){
            status +=1
            if(status > 5) {
               return clearInterval(timer)
            }
            return status
        }
        return foo
    }
    let son = fn()
    let timer = setInterval(() => {
        console.log(son());
    }, 1000);

输出结果:
1
2
3
4
5
undefined

当满足条件清除定时器后 输出的最后结果为undefined ; 先说说原因吧! 因为在定时器中调用的函数; 当函数满足条件清除定时器的时候; 定时器还是会执行当前的这个状态;而此时函数是没有返回值得;所以就是undefined; 解决办法就是 在定时器中判断 ;如果定时器返回的值是undefined就 return出去

function fn(){
        let status = 0
        function foo(){
            status +=1
            if(status > 5) {
               return clearInterval(timer)
            }else{
                return status
            }
        }
        return foo
    }
    let son = fn()
    let timer = setInterval(() => {
        let sty = son()
        if(sty == undefined) return
        console.log(sty);
    }, 1000);