js ajax 函数封装 闭包 回调

Question

有这样一个函数：

function getUserInfo(){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: function () { },
        success: function (data) {  
              console.log(data);      
        }
    });
};

执行这个函数， 希望有个回调，例如： 接上上面的函数写

getUserInfo(data,function(data){
    console.log(data);
})

希望 在 以上代码中 可以获取 getUserInfo 函数的 ajax 查询到的 data 数据

该方法有大神指导一下 该如何写吗

Answer 1

回调

function getUserInfo(data, options) {
    $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        data: data,
        timeout: 6000,
        error: function () {
            options.fail && options.fail();
        },
        success: function (response) {
            options.success && options.success(response);
        }
    });
}

getUserInfo(data, {
    success: function (response) {
        console.log(response);
    },
    fail: function () {
        //TODO
    }
});

Deferred

function getUserInfo(data) {
    return $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        data: data,
        timeout: 6000
    });
}

getUserInfo(data)
    .done(function (response) {
        console.log(response);
    })
    .fail(function () {
        //TODO
    });

建议使用第二种方式

Answer 2

jquery的deferred对象。看下这个 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
里面解释的比较详细

Answer 3

===定义的getUserInfo函数，出入你自定义的回调函数====================

function getUserInfo(callback){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: function () { },
        success: function (data) {  
              //console.log(data);
              callback(data);      
        }
    });
}

===你的调用代码====

getUserInfo(function(userinfoData){
    //处理你的逻辑
})

Answer 4

为嘛要这么写-。-，这种同步的想法，不对把。按照js的异步的思维，应该是回调function写上后续操作把，如果想写成同步一样的感觉，就必须借助楼上@cely的第三方封装的库

Answer 5

// success callback 
// error callback
function getUserInfo(success, error){

     $.ajax({
        type: "POST",
        url: "/user",
        dataType: "json",
        contentType: "application/json;utf-8",
        timeout: 6000,
        error: error,
        success: success
    });
};