javascript - 通过 JS 模块模式返回 ajax 响应

Question

更新:我认为使用 JS 模块模式并不是“保持简单”，所以我放弃了它并使用 jQuery 的延迟对象来返回我正在寻找的数据。我真正需要的是简单地加载一个 JSON 文件并填充一个对象。我只是想通过合并 JS 模块模式来变得过于花哨。

非常感谢@kiramishima 提供的正确答案。

下面是完成的代码:

function getData(){
    var url = CONTEXT + "/json/myJsonFile.json";
    return $.getJSON(url);
}

getData()
    .done(function(data){
        myGlobalObj = data;
    })
    .fail(function(data){
        console.log("fetching JSON file failed");
    });

我觉得我有点太花哨了，不利于我自己。我正在加载 JSON 文件并尝试通过 JS 模块模式返回 API。问题是我相信我没有正确履行 promise ，而且我不知道如何解决它。

这是我的 JSON:

{
    "result": {
        "one": {
            "first_key":"adda",
            "second_key":"beeb",
            "third_key":"cffc"
        },
        "two": {
            "first_key":"adda",
            "second_key":"beeb",
            "third_key":"cffc"
        }
    }
}

这是我的 JS 模块实现:

var data = (function() {
    var url = "/json/dummy.json";
    var getAllData = function() {
        return $.getJSON(url, function(result){});
    };

    var promise = getAllData(); // the promise

    return {
        getFirstObjSecondKey:function() {
            return promise.success(function(data) {
                return data.result.one.second_key;
            });
        },
        getSecondObjThirdKey:function() {
            return promise.success(function(data) {
                return data.result.two.third_key;
            });
        },
    };
})();

问题是“getAllData()”返回为未定义，我不知道为什么；该方法返回一个 Promise，我应该能够在“done”函数中处理它。我离这还有多远？

感谢您提供任何有用的意见。这是我第一次搞乱 JS 模块模式。

Answer 1

我不知道你的问题是什么，但我测试了:

var getAllData = function() {
return $.getJSON('/json/dummy.json', function(result){})
}

getAllData().done(function(data){ console.log(data.result.one.second_key) }) // prints beeb

在这种情况下工作正常，但如果尝试这个:

var data = (function() {
    var url = '/json/dummy.json';
    var getAllData = function() {
        return $.getJSON(url, function(result){});
    };

    return {
        getFirstObjSecondKey:function() {
            getAllData().done(function(data) {
                return data.login;
            });
        },
        getSecondObjThirdKey:function() {
            getAllData().done(function(data) {
                return data.name;
            });
        },
    };
})();

data.getFirstObjSecondKey 返回未定义，那么可以传递匿名函数吗:

var data = (function() {
        var url = '/json/dummy.json';
        var getAllData = function() {
            return $.getJSON(url, function(result){});
        };

        return {
            getFirstObjSecondKey:function(callback) {
                getAllData().done(function(data) {
                    callback(data.result.one.second_key);
                });
            },
            getSecondObjThirdKey:function(callback) {
                getAllData().done(function(data) {
                    callback(data.result.two.third_key);
                });
            },
        };
    })();
var t; 
data.getFirstObjSecondKey(function(data){ 
//data should contain the object fetched by getJSON
console.log(data);  // prints beeb
t = data; // assign t
})
console.log(t) // prints beeb

其他解决方案，始终返回延迟对象