如何在普通的JS函數中使用$ .getJSON（）之類的jQuery函數？

Question

我有這樣的方法

            var getStatus = function (tr, startTime, endTime) {
                var toReturn ="";
                    $.getJSON('../java_output/bugs.json', function (dataOuter) {
                        //random code here//
                        //code causes changes to 'toReturn'

                    });
                return (toReturn);
            }

基本上，我調用getStatus並獲取一個返回值，該值取決於getJSON文件。 但是，因為它是一個回調方法，所以我沒有獲得toReturn的當前版本，而是獲得""作為值，因為這是它的初始化方式。

Answer 1

這是因為$.getJSON是異步調用。 我認為您別無選擇：

1. 睡眠以等待直到收到響應，然后返回它。 很明顯，這將使瀏覽器掛起，直到得到響應或錯誤為止。 不好選擇...
2. 使getStatus為異步函數。 因此，讓它接受回調函數，並將其傳遞給$.getJSON ，或在傳遞給$.getJSON的回調函數中調用它。
3. 使用“延遲對象”模式。 jQuery提供了它： http : //api.jquery.com/category/deferred-object/ 。 基本上，您返回一個“ promise”對象。 客戶端可以將處理程序附加到該對象，以在“解決”或“拒絕”諾言時執行代碼。 在$.getJSON的處理函數中，您可以解析promise，還傳遞響應，或者在發生錯誤時拒絕它。

另請參見此問題，這是類似的情況： 等待Ajax完成以執行其他功能

Answer 2

使用回調！

var getStatus = function (tr, startTime, endTime, callback) {
    var toReturn = "";
    $.getJSON('../java_output/bugs.json', function (dataOuter) {
        //changes..
        callback(toReturn);
    });
}

然后打電話！

getStatus(tr, start, end, function(data) {
    //your toReturn value;
    console.log(data);
});

Answer 3

嘗試

        var getStatus = function (tr, startTime, endTime) {
            toReturn = new $.Deferred();
            $.getJSON("../java_output/bugs.json"
            , function (dataOuter) {
                //random code here//
                //code causes changes to 'toReturn'

                toReturn.resolve(dataOuter);
            });
            return toReturn.promise();
        };
        $.when(getStatus())
            .done(function (_toReturn) {
            // do stuff with `_toReturn` 
            console.log(_toReturn);
        });

jsfiddle http://jsfiddle.net/guest271314/355Pw/