js事件节流

js事件节流是一个非常简单的功能，但是前端开发人员在实际项目中很少考虑到该功能，主要原因可能是项目不大，或者并没有出现卡顿现象，导致开发人员不会想到使用事件节流去优化代码。
其实使用时间节流是一个非常好的习惯，它本身也非常简单，这里我们说一下事件节流。

在项目开发过程中，经常会用到滚动事件（scroll），鼠标移动事件（mouseover）,窗口改变事件（resize），下载或上传文件时的获取操作进度事件（progress）。他们都是触发频率非常快的事件，这时候如果不使用事件节流去优化，可能会出现卡顿情况。

怎么实现事件节流，非常简单，就是在自己设定的时间内，上面提到的事件只触发一次。贴代码

首先定义一个定时器并设置为null，在触发事件后判断定时器的值，如果为null说明当前没有执行程序，这时候触发setTimeout方法，设置延迟时间，这个时间就是触发一次事件的时间间隔。在事件执行后再把定时器对象设置为null，非常简单！

    //监听进度事件
    var timer = null;
    xhr.addEventListener("progress", function (evt) {
        try{
            //设置事件节流
            if(!timer) {
                timer = setTimeout(function () {
                    $('.fileDown').text(btTran(evt.loaded)+'/'+btTran(evt.total)+' 文件下载中...');
                    timer = null;
                },300)
            }

        }catch(e){}
    }, false);

笔者在做事件节流相关功能时，发现按照上面的思路可以实现事件节流，但是也存在一个问题，比如鼠标移动事件，如果移动的时间比你设置的延迟时间要快，那么最后一次移动的事件则无法触发（说的不能触发的是鼠标移动后要执行的操作，不是鼠标移动事件本身不能触发）。

如果你有比较好的思路欢迎告知，谢谢！！！