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

何かをロックしようとしないでください。最もクリーンな方法は、常にコードの非同期性に適応することです。したがって、非同期関数がある場合は、コールバックを使用してください。あなたの特定のケースでは、非同期呼び出しの前に実行される 1 つの部分とその後に実行される 1 つの部分に関数を分割することをお勧めします。

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は非同期関数で、この例では 1 つの引数 (コールバック関数) を受け取り、2 番目のchangeTheDom関数を呼び出します。

于 2013-06-20T19:35:19.817 に答える