Рефакторинг многих вызовов jQuery Ajax - лучшая практика?

Question

У меня есть много блоков кода JavaScript/jQuery для обработки асинхронных данных обработки данных на моей странице. Каждый кодовый блок имеет три функции (код является неполным и только для иллюстративных целей):

1. инкапсулирует $.ajax вызова:

   function doSomething(data){ 
   
       // do some preprocessing 
   
       $.ajax({}); // some JQuery Ajax operation that accepts data 
   
       // do some postprocessing 
       return false; 
   }

2. обрабатывает ответ:

   function handleResponse(result){ 
       // process the result 
       return false; 
   }

3. обрабатывает любой ошибка:

   function handleError(XMLHttpRequest, textStatus, errorThrown){ 
       // gracefully handle the Error and present relevant information to user 
       return false; 
   }

На странице, которая требует много обработки данных, я в конечном итоге иметь много этих блоков, которые, как представляется, дублирование, поэтому я решил сделать некоторые рефакторинга.

Я полагаю, что это будет по-другому.

1. Возможно, имеется один обработчик ошибок, который можно использовать повторно через вызовы Ajax (очевидно).
2. Возможно, можно использовать несколько обработчиков ответов, но это было бы неудобно, так как ответы очень разные в зависимости от вызова.
3. Возможно, создается какой-то прототип объекта, который обеспечивает базовую функциональность и имеет статический метод обработки ошибок (это можно сделать в JavaScript?).

Мне просто интересно, если кто-нибудь встретил это и/или если для этого есть решение для лучшей практики?

Answer 1

Вы можете использовать метод $ .ajaxSetup ({}) в jQuery для настройки некоторых общих настроек ajax.

Например, если вы собираетесь размещать на одном и том же URL снова и снова на одной странице, вы можете просто установить его в ajaxSetup. Это означало бы, что вам придется передавать меньше параметров функции, например, как это сделал Ричард. Любое свойство первого параметра метода ajax можно установить как значение по умолчанию в $ .ajaxSetup().

$.ajaxSetup({ 
    url: 'my/ajax/url' 
    success: function() { 
     // Do some default stuff on success 
    }, 
    error: function() { 
     // Do some default stuff on a failure 
    } 
    // etc... 
}); 

Их можно переопределить при любом вызове ajax. Итак, теперь вы можете просто сделать:

$.ajax({data:{foo:'bar',bar:'foo'}}); 

И вы можете переопределить URL, например, так:

$.ajax({url:'different/ajax/url',data:{foo:'bar',bar:'foo'}}); 

Answer 2

Мы часто использовали функцию-оболочку для вызова Ajax для того, чтобы упростить использование, так что вы можете сделать это:

function NewAjax(url, data, success) 
{ 
    $.ajax({ 
     url: url, 
     data: data, 
     success: success, 
     fail: function() 
     { 
     // Do generic failure handling here 
     } 
} 

Но я часто предпочитаю связываться с каждым АЯКС события, используя Ajax события JQuery:

http://docs.jquery.com/Ajax

, чтобы вы могли привязать к каждой неудачи или успеха каждого AJAX вызова, такие как:

ajaxError (вызова назад) ajaxSuccess (обратный вызов)

Answer 3

Как показывает Ричард, посмотрите, что отличается от фрагментов кода и передайте их в качестве параметров функции. Javascript может передавать функции как параметры, которые могут избавиться от большой избыточности.

Если URL-адрес не изменяется, то зачем передавать его в качестве параметра, вы можете иметь глобальную переменную, которая будет содержать основную часть URL-адреса, и просто передать часть изменяющегося URL-адреса.