防抖 与 节流

防抖（debounce）

防抖就是 短时间内大量触发同一件事，只触发一次；

function debuonce(fn, delay){
  let timer = null;
  return function() {
    if(timer) {
		clearTimeout(timer) // 将上一次的清除掉
	}
	timer = setTimeout(fn, delay); // 然后重新计时  
  }
}

调用

function log(){
	console.log(2)
}

window.onscroll = debounce(log, 2000)

节流（throttle）

如果限定时间内，不断触发 滚动事件， 只要不停，就永远不会输出console.log(2)

如果需求是 也要 在间隔的打印出 2， 只不过没有那么频繁的话，就是用到节流。

function throttle(fn, delay){
	let valid = true;
	return function(){
     if (!valid) { // 休息时间
		return false;
	  }
	  // 工作时间了
	  valid = false;
	  setTimeout(() => {
		valid = true;
		fn();	
	  }, delay)
    }

}

function log(){
	console.log(2)
}

window.onscroll = throttle(log, 2000)
// 这样就是 持续滚动，但是会间隔2秒输出