为了避免在类似scroll，mousemove，resize等持续触发的事件中频繁的执行函数,出于优化性能的目的，使连续触发事件在 n 秒中只执行一次函数
1、防抖debounce(多次执行只执行最后一次)
在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时
应用场景：
- 给按钮加函数防抖防止表单多次提交。
- 对于输入框连续输入进行AJAX验证时，用函数防抖能有效减少请求次数。
- 判断
scroll是否滑到底部，滚动事件+函数防抖
var debounce = function(fn,delay){
var timer = null
return function(){
//清除上一次的定时器
clearTimeout(timer)
// 重新计时
timer = setTimeout(function(){
fn.apply(this)
},delay)
}
}
2、节流throttle(每隔一段时间执行一次)
规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，如果在同一个单位时间内某事件被触发多次，只有一次能生效。
应用场景：
- DOM元素拖拽(mousemove)
- Canvas绘画
//节流
var thottle = function(fn,delay){
var lastTime = 0
return function(){
var nowTime = Date.now()
if(nowTime-lastTime>=delay){
fn.call(this)
lastTime = nowTime
}
}
}
//通过setTimeout实现
var throttle2 = function(func, delay) {
var timer = null;
return function() {
var context = this;
var args = arguments;
if (!timer) {
timer = setTimeout(function() {
func.apply(context, args);
timer = null;
}, delay);
}
}
}
document.onscroll = thottle(function(){console.log(111)},200)
