函数防抖与函数节流

Double_路

于 2021-08-10 15:29:12 发布

阅读量82

点赞数

分类专栏： javaScript

本文链接：https://blog.csdn.net/qq_44606245/article/details/119570679

版权

javaScript 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

本文深入探讨了JavaScript中两种重要的性能优化技术——函数防抖和函数节流。函数防抖确保在一定时间内只执行最后一次调用，而函数节流则限制了函数在特定时间间隔内的执行频率。通过示例代码，详细解释了它们的工作原理和应用场景，帮助开发者优化UI响应速度和减少不必要的计算。

摘要由CSDN通过智能技术生成

函数防抖

简单点来说就是带着一起做，一段时间内会等，然后带着一起做

function debounce(fn,delay){
	let timerId = null
	return function(){
		if(timerId){window.clearTimeout(timerId)}
		timerId = setTimeout(()=>{
			fn.apply(this,arguments)
			timerId = null
		},delay)
	}
}

函数节流

就是一段时间执行完一次之后，就不会执行第二次

function throttle(fn,delay){
	let canUse = true
	return function(){
		if(canUse){
			fn.apply(this,arguments)
			canUse = false
			setTimeout(()=>{
				canUse = true
			},delay)
		}
	}
}