javascript - Javascript変数は、ループの外側、OKの内側では更新されません

Question

ここで明らかな何かを見逃していないことを願っています。

function renderViews(containerId) {

    var root = '../Views/';
    var viewsDomStr = '';

    for (var i = 0; i < bundles.views.length; i++) {
            $.get(root + bundles.views[i], function (data) {
            viewsDomStr = viewsDomStr.concat(data);
        });
    }

    console.log(viewsDomStr);
    $('#' + containerId).append(viewsDomStr);

}

問題は、ループ内でのみサーバーからviewsDomStrに応じて更新されることです。私が得るのは、へのリセットだけです。dataforconsole.log(viewsDomStr);''

Answer 1

呼び出している関数は非同期です。

で試してみてください

function renderViews(containerId) {

    var root = '../Views/';
    var viewsDomStr = '';

    function cb(){
        console.log(viewsDomStr);
        $('#' + containerId).append(viewsDomStr);
    }

    for (var i = 0; i < bundles.views.length; i++) {
            $.get(root + bundles.views[i], function (data) {
            viewsDomStr = viewsDomStr.concat(data);
            cb();
        });
    }
}

Answer 2

問題は、$.getリクエストが非同期であるため、プログラムが続行し、それを待たないことです。関数viewsDomStr内で使用したい。$.get

function renderViews(containerId) {

    var root = '../Views/';

    for (var i = 0; i < bundles.views.length; i++) {
        $.get(root + bundles.views[i], function (data) {
            console.log(data);
            $('#' + containerId).append(data);
        });
    }

    // This section runs before $.get is finished
}

編集：私はそれviewsDomStrが実際には冗長であることがわかりました。要素にテキストを追加しているだけなので、テキストをに追加できます$.get。

Answer 3

getメソッドは非同期リクエストを送信するため、 setIntervalを使用して1秒ごとにレスポンスを確認できます。

function renderViews(containerId) {

    var root = '../Views/';
    var viewsDomStr = '';

    var success = false;

    for (var i = 0; i < bundles.views.length; i++) {
            $.get(root + bundles.views[i], function (data) {
            viewsDomStr = viewsDomStr.concat(data);
            success = true;
        });
    }

    var t = setInterval(function(){
        if(success) {
            console.log(viewsDomStr);
            $('#' + containerId).append(viewsDomStr);
            clearInterval(t);
        }
    },1000);
}

Answer 4

メソッドの無名関数はget非同期になります（getそれ自体の実行に従って）。

要するに、それはすべて速すぎます。