防抖与节流

防抖与节流，解决了在一段时间内，频繁触发同一个事件带来的性能问题

区别：
防抖即频繁触发事件后，一段时间内没有触发才执行
节流即频繁触发事件，但规定一段时间内只执行一次

防抖：

	function debounce(callback, time) {
		//定义计时器
	    var timer;
	    //闭包避免全局污染
	    return function () {
	    	//清除定时器
	        clearTimeout(timer);
	        //重新开始计时
	        var args = arguments
	        timer = setTimeout(() => {
	            callback.apply(null, args)
	        }, time);
	    }
	}

测试：
没有使用防抖：

	document.onmousemove = function () {
		console.log(1);
	}

使用防抖：

	document.onmousemove = debounce(function () {
		console.log(1);
	},1000);

节流：

	function throttle(callback,time) {
		//定义计时器
		var timer;
		//闭包避免全局污染
		return function () {
			var args = arguments;
			//无定时器时，开启定时器
			if(!timer){
				timer = setTimeout(function () {
					callback.apply(null,args);
					//清除定时器
					timer = null;
				},time)
			}
		}
	}

测试：
没有使用节流：

	document.onmousemove = function () {
		console.log(1);
	}

使用节流：

	document.onmousemove = throttle(function () {
		console.log(1);
	},1000);

进阶版节流函数：

	function throttle(callback, time, immediately) {
	    if (immediately) {//是否立即执行一次
	        var t;
	        return function () {
	            //之前没有计时 或 距离上次执行的时间已超过规定的值
	            if (!t || Date.now() - t >= time) {
	                callback.apply(null, arguments)
	                //得到的当前时间戳
	                t = Date.now()
	            }
	        }
	    } else {//如果不立即执行一次，那么这个时间让他延迟多长时间后再执行
	        var timer;
	        return function () {
	            if (timer) return
	            var args = arguments
	            timer = setTimeout(() => {
	                callback.apply(null, args)
	                timer = null
	            }, time);
	        }
	    }
	}