0

我有一个如下的 JavaScript 函数。

function changeTheDom(var1, var2, var3) {
    // Use DWR to get some server information
    // In the DWR callback, add a element to DOM
}

这个函数在页面的几个地方被调用。有时，在一个循环中。changeTheDom按照调用函数的顺序将元素添加到 DOM 中很重要。

我最初尝试添加DWREngine.setAsync(false);到函数的开头和函数DWREngine.setAsync(true);的末尾。虽然这有效，但它在页面的其余部分引起了彻底的疯狂。

所以我想知道是否有办法锁定该changeTheDom功能。我找到了这篇文章，但我无法真正遵循else循环或lockingFunction打算如何调用它。

任何帮助理解该帖子或只是进行锁定程序将不胜感激。

4

2 回答 2

0

我想我终于明白了你的意思，我决定创建另一个答案，希望对你更有帮助。

为了在处理多个异步函数调用时保持顺序，您可以编写一个简单的 Queue 类：

function Queue(){
    var queue = [];
    this.add = function(func, data) {
        queue.push({func:func,data:data});
        if (queue.length === 1) {
            go();
        }
    };
    function go() {
        if (queue.length > 0) {
            var func = queue[0].func,
                data = queue[0].data;

            //example of an async call with callback
            async(function() {
                    func.apply(this, arguments);
                    queue.shift();
                    go();            
            });
        }
    }
};

var queue = new Queue();

function doit(data){
    queue.add(function(result){
        console.log(result);
    }, data);
}


for (var i = 0; i < 10; i++) {
    doit({
        json: JSON.stringify({
            index: i
        }),
        delay: 1 - i / 10.0
    });
}

小提琴

因此，每次调用异步函数时，都会调用queue.add()它将函数添加到队列中，并确保它仅在队列中的其他所有内容完成时才会执行。

于 2013-06-20T21:30:37.930 回答
0

不要试图锁定任何东西。最干净的方法始终是适应代码的异步特性。因此，如果您有异步函数，请使用回调。在您的特定情况下，我建议您将函数拆分为在 asych 调用之前执行的一部分和之后执行的一部分：

function changeTheDomBefore(var1, var2, var3) {
    //some code
    //...
    asyncFunction(function(result){
        //this will be executed when the asynchronous function is done
        changeTheDomAfter(var1, var2, var2, result); 
    });
}

function changeTheDomAfter(var1, var2, var3, asynchResult) {
    //more code
    //...
}

asyncFunction是异步函数，在此示例中，它采用一个参数 - 回调函数，然后调用您的第二个changeTheDom函数。

于 2013-06-20T19:35:19.817 回答