js闭包原理及其应用场景

闭包这个概念一直困扰这我,很多时候背了,过段时间又记不住了。之所以这样是因为自己并没有真正理解什么是闭包。很多时候你觉得一个概念很复杂记不住,很有可能是你对这个概念理解错了。

很多人会说闭包会造成内存泄露,其实这是错误的。之所以会造成内存泄露是因为IE浏览器造成的,并不是所有浏览器都会这样。通常之所以会造成内存泄露,是因为浏览器保存了没有被引用的变量,但是闭包的本地变量是被引用和使用的,就不存在内存泄露的问题。

我们来看一下闭包的定义:

「函数」和「函数内部能访问到的变量」(也叫环境)的总和,就是一个闭包。

防抖和节流是闭包的典型应用场景,我们来看一下代码:

防抖:

function debounce(fn, delay) {
    var timer = null;
    return function() {
        if(timer) {
            clearTimeout(timer);
        }  
        timer = setTimeout(() => {
                fn&&fn();
        }, delay);
    }
    
}

节流:

function throttle(fn, delay) {
	var timer = null;
	return function() {
		if(!timer) {
			timer = setTimeout(() => {
				timer = null
				fn&&fn()
			}, delay);
		}
	}
}

防抖的业务场景一般是在实时输入检索,节流的业务场景一般为高频事件回调,比如图片懒加载

你可能感兴趣的:(web前端,javascript)