javascript - 将带有参数的成功回调函数传递给执行 AJAX 调用的另一个函数

Question

我是 javascript 新手，并试图了解以下事情是否可能:

假设我在代码中的多个位置使用以下 ajax 请求构造(具有不同的成功回调函数 - 在本例中仅 handleSuccessCallback())以及不同的 url 和数据请求参数:

  jQuery.ajax({
        type: 'GET',
        url: loadUrl,
        data: data,
        error: errorCallback,
        success: function(response) {
            this.handleSuccessCallback(response);
        }
    }); 

function handleSuccessCallback(response) {
     Do something with response here...
}

我想以这种方式重构这段代码，这样我就不需要每次需要发送请求时都在上面创建构造。我想在我的 utils 类中创建一个函数，该函数将获取 url、请求数据和错误/成功回调。像这样的事情:

 function sendAjaxRequest(url, data, errorCallback, successCallback)
  jQuery.ajax({
        type: 'GET',
        url: url,
        data: data,
        error: errorCallback,
        success: successCallback
  }); 
 }

然后，我想多次调用此函数，并从主脚本传递不同的参数。

在我的主代码中:

var url = "https://some url";
var data = {};
var errorCallback = handleErrorCallback();
var successCallback = handleSuccessCallback(); // ??? This function requires `response` argument being passed, how it can be done?

utils.sendAjaxRequest(url, data, errorCallback, successCallback);


function handleSuccessCallback(response) {
     Do something with response here...
}

function handleErrorCallback() {
     Do something with error here...
}

但是，我不明白的是:如果我的 handleSuccessCallback(response) 需要参数，如何将成功回调函数 (handleSuccessCallback(response)) 传递给 sendAjaxRequest() 函数是成功ajax回调本身的结果(response)？

如果我还不知道，在将其传递给 sendAjaxRequest() 时，如何将这个 response 参数传递给 handleSuccessCallback()将是来自 ajax 调用的响应？

Answer 1

当你想打电话时:

function sendAjaxRequest(url, data, errorCallback, successCallback)

您只需为 errorCallback 和 successCallback 提供函数名称。您正在传递函数引用，因此它们可以由其他代码调用。参数在调用这些函数时提供，如原始示例所示:

success: function(response) {
        this.handleSuccessCallback(response);
    }

这里是 ajax 中定义的成功函数，第一个参数为 response，因此这里有一个匿名函数，第一个参数为 response >.

因此，您只需定义函数以匹配它们被 ajax 调用时的内容，例如:

var firstSuccessCallback = function(response) {
    //do something;
}

var firstErrorCallback = function(error) {
    //do something;
}

你可以这样做:

sendAjaxRequest(url, data, firstErrorCallback, firstSuccessCallback)