多个Ajax共用一个回调函数或并发

2016-07-01

多个Ajax共用一个回调函数

开始的时候猜到的大坑

在写网页时，有时多个请求可以共用一个回调函数来完成功能，进行了多次研究，整理了一些经验

var statusUtil = {
    response:function(response) {
      alert(response.message)
    },
    sign:function() {
        $.post(url,{"id":10},this.response(response),"json")
    },
    revoke:function() {
        var handler = $.post(url,{"id":10})
        handler.done(this.response(response))
    }

}

最开始的时候使用以上的代码，会报错 TypeError: response is not a function. (In ‘response(response)’, ‘response’ is undefined) 的错误，根据我的文章JS的回调函数中分析的原因

在JS代码中()代表的意思是作为函数执行

一个取巧的解决方案

在没有意识到这一点的时候，我总觉得传递回调函数的时候应该带着参数，所以会写
**this.response(response)**来传入参数，后来发现报错，就使用返回一个函数的方法折衷获得结果

var statusUtil = {
    response:function() {
      return function(reponse) {
        alert(response.message)
      }
    },
    ....
}

此时就可以通过**this.response()**获取到回调函数

理解了回调后的正确方式（也不知道理解对没有）

由于JS的传递参数过程是一个复制的过程，我们只需要把函数的地址作为参数传入，至于函数本身的参数，并不需要关心，正确的代码

var statusUtil = {
    response:function(response) {
      alert(response.message)
    },
    sign:function() {
        $.post(url,{"id":10},this.response,"json")
    },
    ....
}

Ajax并发

在查询共用一个回调函数时，还发现JQuery存在一个when…done…函数

var url1 = "/resource/ar/hometab/index_tab_games.json"
var url2 = "/resource/ar/hometab/index_tab_image.json"
var ajax1 = $.ajax({url : url1})
var ajax2 = $.ajax({url : url2})

　$.when(ajax1, ajax2).done(function(){
　　　　 alert("done");
　　　　}).fail(function(){
　　　　 alert("fail");
　　　　});

该函数是并发多个Ajax请求，然后等待接收到所有返回后才会触发回调函数，根据别人总结

使用$.when()的方式会等到两个请求都返回之后才触发回调函数
只有当两个请求都成功返回时才会触发done回调