Question

我想在循环中查看列表中的大约3000个项目。在每个步骤中，我必须在页面上进行异步httprequest。使这成为一个递归函数ist throw InternalError: too much recursion 到目前为止，这是我的代码：

var iteratorObject = new function(){
    this.currentStep = -1;
    this.iterationList = {};

    this.start = function(list){
         this.iterationList = list;
         this.next(0);
    }

    this.next = function(value) {
        this.currentStep = value;
        if(this.currentStep +1 == this.iterationList.length){
            return
        }
        var currentID = this.iterationList[this.currentStep];

        //Do Aysnc HttpRequest on succeed call this.next(value +1);
    }

}

var iterator = iteratorObject;
var iterationList = Object.keys([Object]);
    iterator.start(iterationList);

如何更改代码以避免递归函数，并且一次只处理一个请求？

Answer 1

当我想使用javascript将记录从外部数据库复制到sql lite db时，我遇到了这种类型的问题。通常for循环不会让你做等待ajax请求调用的递归代码去下一次迭代，那么我建议你是：

使您的代码尽可能全局，以同样的方式处理所有对象
将对象放入表中
创建一个函数，将对象表作为参数和每次它完成请求后，它将再次使用下一个元素调用它自己，直到到达表的末尾。

示例：

function recursive_calls(var elements[],var currentPosition){
    if(currentPosition<elements.length){
        $.ajax({
            url:some_api/elements[i].id,
            method:'get',
            success:function(res){
            //after some time ajax success function is fired
            //do some stuff here
            //call recursive_calls function again
                currentPosition++;
                recursive_calls(elements,currentPosition);
            }
        });
    }
}

Answer 2

只是为了添加另一个解决方案，我认为这是一个有趣的问题，所以这是我根据你原来的解决方案编写的东西：

function Iterator(doWork) {
    var done, start;

    done = function () {
        start();
    };

    start = function () {
        doWork(done);
    };

    // Export this method.
    this.start = start;
}

用法是：

<ul id="times">
    Iterations...
</ul>

<script type="text/javascript">
$(function () {
    var maxIterations = 7000,
        $times = $('#times');

    var iterator = new Iterator(function (next) {
        var now = new Date();

        window.setTimeout(function () {
            var ms = (new Date() - now);

            $times.append($('<li></li>').text('Iteration ' + ($times.find('li').length + 1) + ': ' + ms + ' ms'));

            maxIterations -= 1;
            if (maxIterations > 0) {
                next();
            }
        }, 100);
    });

    iterator.start();
});
</script>

这导致了一个有趣的观察结果：Chrome有一种比Internet Explorer更好的计时器。

Chrome示例输出：

Iteration 5687: 101 ms
Iteration 5688: 101 ms
Iteration 5689: 101 ms
Iteration 5690: 101 ms
Iteration 5691: 101 ms
Iteration 5692: 101 ms
Iteration 5693: 101 ms
Iteration 5694: 101 ms
Iteration 5695: 100 ms
Iteration 5696: 101 ms
Iteration 5697: 101 ms
Iteration 5698: 101 ms
Iteration 5699: 102 ms

现在用于Internet Explorer：

•Iteration 5687: 92 ms
•Iteration 5688: 93 ms
•Iteration 5689: 108 ms
•Iteration 5690: 93 ms
•Iteration 5691: 109 ms
•Iteration 5692: 92 ms
•Iteration 5693: 93 ms
•Iteration 5694: 109 ms
•Iteration 5695: 93 ms
•Iteration 5696: 92 ms
•Iteration 5697: 109 ms
•Iteration 5698: 93 ms
•Iteration 5699: 108 ms

For循环中的JavaScript异步调用

2 个答案: