使用队列控制多个请求访问一个异步方法

来源:互联网 发布:章台之柳 知乎 编辑:程序博客网 时间:2024/06/05 07:25

在异步搜索的时候搜索出来的东西和实际的不符合。

使用队列来控制搜索的次数与条件。

  

            //队列            Queue:function(){                var arr = [];                //入队                this.push = function (item) {                    arr.push(item);                    return true;                };                //出队                this.shift = function () {                    return arr.shift();                };                //获取队首                this.getHead = function () {                    return arr[0];                };                //获取队尾                this.getTail = function () {                    return arr[arr.length - 1];                };                //删除数组固定位                this.splice = function (start,end) {                    arr.splice(start, end);                };                //清空数组                this.clear = function () {                     arr=[];                };                //获取数组长度                this.getLength = function () {                    return arr.length;                };            }

  搜索的时候,按钮第一次被按下时,将搜索条件push到队列里,并调用搜索方法。非第一次直接就push到队列里。

  搜索方法执行时,先取队尾的搜索条件,校验,将搜索条件附加到参数中。在成功返回的回调中获取当前队列的长度,如果队列长度大于1,删除除了队尾的其余搜索条件,并递归执行搜索方法,否则就清空队列。每次执行都会只剩下队尾的一个或空,直到没有再按下搜索条件,递归才会终止。

     var queue=new Queue();     //搜索点击     function onSearchClick(key){                  if(queue.getLength==0){            queue.push(key);            search()         }else{            queue.push(key);          }     }     //搜索     function search(){         //获取队尾         var key=queue.getTail();         if(!key){             $.ajax({                ....                data:{searchKey:key},//赋值搜索条件                ....                success:function(result){                    var length=queue.getLength();                    if(length>1){                        //清空除队尾的其余条件                        queue.splice(0,length);                        //递归调用                        search();                    }else{                        //清空队列                        queue.clear();                    }                                    },                         })         }     }         //队列    Queue:function(){        var arr = [];        //入队        this.push = function (item) {            arr.push(item);            return true;        };        //出队        this.shift = function () {            return arr.shift();        };        //获取队首        this.getHead = function () {            return arr[0];        };        //获取队尾        this.getTail = function () {            return arr[arr.length - 1];        };        //删除数组固定位        this.splice = function (start,end) {            arr.splice(start, end);        };        //清空数组        this.clear = function () {            arr=[];        };        //获取数组长度        this.getLength = function () {            return arr.length;        };    }

  如上完整的控制搜索代码,在这里还得说最开始我的思路是有的,但是代码写的很糟糕,基本没有层次,逻辑也是到处乱串。本来我以为能实现功能就是最好,直到一个经验比较丰富的同事做了类似的功能,我撒了一眼,果然我还是太菜了。于是参照同事的代码结构结合自己的思路重构了一下,感觉比之前的好多了。

  这个事件让我意识到自己还是积累知识,积累经验的时段。还是需要不断学习,我们所处如逆水行舟,不进则退。


阅读全文
0 0