关于setTimeOut有时候不生效的误解

在写Angularjs的项目中，需要写一个模糊查询的需求，因为需要控制查询的频率，就在查询事件中添加了一个定时器setTimeOut(fn,500)，此定时器的作用就是让查询时间0.5秒触发一次，降低后台的压力。 但是后来发现没有起到想要的效果，最后才发现各个定时器都执行了，因为多余的定时器没有及时清除，导致定时器叠加执行，虽然0.5秒的延迟时间起到作用了，但是在这个延迟时间中，前面的几个定时器中的函数都在执行，最后造成了类似没有起作用的假象，其实是过了0.5秒各个定时器都依次执行完造成的结果。

$scope.orgTable = [];
        $scope.timerBill = null;
$scope.fuzzyQuery = function () {
                $scope.orgArr = [];
                var value = $('#orgChecked').val();
                if($scope.timerBill){
                    clearTimeout($scope.timerBill);
                }
                if (value.length) {
                    $scope.timerBill=setTimeout(function () {
                        $http.get(Configuration.latestAPI + 'xxx?sso_token=' + Configuration.token).success(function (res) {
                            if (res.status == 'S') {                             

                            }
                        })
                    }, 300);
                } else {
                  
                }
            };
复制代码

后面在代码中加上了以下部分的代码，主要是每次出发模糊查询函数的时候都清除前一次执行留下的定时器，保证永远只有一个定时器在运行。

if($scope.timerBill){
        clearTimeout($scope.timerBill);
    }
复制代码

总结：在触发次数频繁的函数中如果用到定时器，在函数开头一定要记得清除可能遗留下来的定时器，确保整个函数执行过程中只有一个定时器存在，才能确保函数的正确执行。

转载于:https://juejin.im/post/5b456b7ee51d4519721b76d7