JavaScript节流函数和防抖函数之间的区别

JavaScript节流函数和防抖函数之间的区别

两者都是优化高频率执行js代码的一种手段

节流函数：指一定时间内js方法只跑一次

防抖函数： 指频繁触发的情况下，只有足够的空闲时间，才执行代码一次

节流函数

var flat = true;
window.onscroll = function(){
	if(!flat){
		// 判断是否已空闲，如果在执行中，则直接return
		return;
	}

	flat = false;
	setTimeout(function(){
		console.log("函数节流");
		flat = true;
	}, 300);
};

防抖函数

var timer = false;
window.onscroll = function(){
	clearTimeout(timer); // 清除未执行的代码，重置回初始化状态

	timer = setTimeout(function(){
		console.log("函数防抖");
	}, 300);
};