防抖和节流

我是你大爷的兄弟

已于 2022-04-26 15:58:33 修改

阅读量56

点赞数

文章标签： js

于 2022-04-26 15:56:39 首次发布

本文链接：https://blog.csdn.net/zhongjiezhe169/article/details/124429593

版权

本文探讨了防抖和节流在防止函数过度调用中的作用。节流案例展示了在Vue环境中如何实现，通过设置标志变量限制函数执行频率。防抖和节流在前端性能优化中至关重要，适用于滚动事件、输入验证等场景。欢迎分享更多实用案例。

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

防抖和节流
	作用：都是防止函数多次调用
	区别：
		一个用户一直触发一个函数，且每次触发函数的间隔小于wait，
		防抖的情况下只会调用一次，而节流的情况会每隔一定时间（参数wait）调用函数

节流案例（基于vue）
	<el-button @click="add">点击</el-button>
	
	data中定义变量: flag = true

	add() {
		if(flag) {
			this.flag = flase
			setTimeout(() => {
				this.flag = true
			}, 1000)
			//接下来这里执行其他接口调用
		}
	}