9

私は単純な一次元配列を持っています、例えば：

fruits = ["apples","bananas","oranges","peaches","plums"];

私は関数でループすることができます$.each()：

$.each(fruits, function(index, fruit) {  
   showFruit(fruit);
});

しかし、次の項目に進む前に終了する必要がある別の関数を呼び出しています。

だから、私がこのような関数を持っている場合：

function showFruit(fruit){
    $.getScript('some/script.js',function(){
        // Do stuff
    })
}

先に進む前に前の果物が追加されていることを確認するための最良の方法は何ですか？

4

2 に答える 2

19

次のフルーツをロードする前に1つのフルーツを追加する場合は、コードを現在のように構造化することはできません。これは、のような非同期関数$.getScript()では、実行が続行される前に完了するまで待機させる方法がないためです。を使用して同期に設定することは可能です$.ajax()が、それはブラウザにとっては悪いことです（ネットワーク中にブラウザをロックします）ので、お勧めしません。

代わりに、非同期で動作するようにコードを再構築する必要があります。つまり、非同期で繰り返されないため、従来のループforや.each()ループを使用することはできません。

var fruits = ["apples","bananas","oranges","peaches","plums"];

(function() {
    var index = 0;

    function loadFruit() {
        if (index < fruits.length) {
            var fruitToLoad = fruits[index];
            $.getScript('some/script.js',function(){
                // Do stuff
                ++index;
                loadFruit();
            });
        }
    }
    loadFruit();

})();

ES7（またはES7コードをトランスパイルする場合）では、次asyncのawaitように使用することもできます。

var fruits = ["apples","bananas","oranges","peaches","plums"];

(async function() {
    for (let fruitToLoad of fruits) {
        let s = await $.getScript('some/script.js');
        // do something with s and with fruitToLoad here
    }

})();
于 2012-09-10T21:35:24.667 に答える
1

ブラウザのJavascriptはシングルスレッドです。呼び出した関数が戻るまで続行されません。チェックする必要はありません。

于 2012-09-10T21:08:32.833 に答える