javascript - 用于可重用性的通用 $.ajax() 调用函数

Question

我正在创建一个应用程序，其中我有很多对远程服务器的 ajax 调用并广泛使用它们。由于所有调用中的代码几乎相同，我想创建一个可以重用的新函数。我对定义“数据”参数的参数结构感到震惊。我将在下面解释我的问题。

下面提供了我当前的 ajax 调用示例。

当前通话样本：

$.ajax({
    beforeSend: function() {
        $.mobile.loading('show');
    },
    complete: function() {
        $.mobile.loading('hide');
    },
    type: 'GET',
    url: 'http://localhost/test-url/',
    crossDomain: true,
    data: {appkey: '1234567', action: 'action1','name':'me'},
    dataType: 'jsonp',
    contentType: "application/javascript",
    jsonp: 'callback',
    jsonpCallback: 'mycallback',
    async: false,
    error: function() {
        //some operations
    },
    success: function(data) {
        //some operations
    }
});

我创建的可重用功能：

function newAjax(parm, successCallback, errorCallback) {
    $.ajax({
        beforeSend: function() {
            $.mobile.loading('show');
        },
        complete: function() {
            $.mobile.loading('hide');
        },
        type: 'GET',
        url: 'http://localhost/test-url',
        crossDomain: true,
        data: {appkey: '1234567', parm: parm},
        dataType: 'jsonp',
        contentType: "application/javascript",
        jsonp: 'callback',
        jsonpCallback: 'mycallback',
        async: false,
        success: function() {
            successCallback();
        },
        error: function() {
            errorCallback();
        }
    });
}

问题：

我将通过“parm”参数传递 ajax 调用的参数。我希望将数据值直接添加到父“数据”参数中。而不是作为数据的子对象。appKey 在所有调用中保持不变，因此我将其保留在实际函数中。
我希望成功和错误回调函数都是可选的。如果未提供，则应忽略它们。

score 5 · Accepted Answer

您可以使用该jQuery.extend方法将两个或多个对象组合在一起。
```
data: jQuery.extend({appkey: '1234567'}, parm),
```

您可以检查您是否实际传递了用于successCallback和errorCallback使用的函数typeof var === 'function'；

success: function () {
    if (typeof successCallback === 'function') {
        successCallback();
    }
}, 

error: function () {
    if (typeof errorCallback === 'function') {
        errorCallback();
    }
}

...虽然如果您只是返回由 AJAX 请求创建的 Promise 可能会更好，并让调用者添加他们的成功、错误处理程序（如果他们愿意）；

function newAjax(parm) {
   return jQuery.ajax({
       /* as before, but without success and error defined */
   });
}

... 然后：

newAjax().done(function () {
    // Handle done case
}).fail(function () {
    // Handle error case.
});

如果调用者不想添加错误处理程序，他们只是不调用fail();

newAjax().done(function () {
    // Handle done case
});

javascript - 用于可重用性的通用 $.ajax() 调用函数

1 回答 1

Related

Reference