come eseguire javascript durante l'attesa della callback ajax

Question

Sto effettuando una chiamata Ajax al server. Il codice che devo eseguire può essere diviso in 3 gruppi.

1. codice che deve essere eseguito prima che i pro ajax chiamata effettuata (preparare l'oggetto JSON andare al server)
2. codice che deve essere eseguito dopo che la chiamata AJAX è tornato (usa ciò che è stato inviato indietro dal server)
3. Codice che deve essere eseguito tra il momento in cui l'utente preme un pulsante e il tempo in cui è stato eseguito tutto. Questo codice non ha bisogno dell'oggetto restituito JSON.

Sarebbe ideale eseguire il codice nel gruppo 3 dopo aver effettuato la chiamata ajax e prima che i risultati tornino per ottenere la migliore esperienza utente e prestazioni.

Questo può essere fatto?

Come?

Answer 1

Molto semplicemente:

function someFunction() { 
    //1. code that needs to run before ajax 
    $.ajax({...}).done(function() { 
     //2. code that needs to be run after the ajax call has returned 
    }); 
    //3. code that needs to be run between the time the user presses 
    // a button and the time everything is done. 
} 

Questo funziona perché JavaScript è sincrona in esecuzione (a meno che non vengono utilizzati i lavoratori, ma che è estraneo a questo particolare problema). Il primo bit di codice verrà eseguito, quindi la chiamata ajax dirà al browser di avviare una richiesta XHR, ma someFunction non è stata completata, quindi continuerà ad essere eseguita in modo sincrono.

Al termine di someFunction, il flusso di controllo verrà aperto a tutti gli eventi asincroni che si verificano, conducendo infine al callback done.

Per essere sinceri, la programmazione asincrona orientata agli eventi non è facile per la maggior parte delle persone. È facile perdere la cognizione di quale codice dovrebbe verificarsi a che ora.

Ecco un esempio facilmente eseguibile di come asincrona comportamento funziona:

(function() { 
    alert(1); 
    setTimeout(function() { 
     alert(2); 
    }, 0); //note the 0ms delay 
    alert(3); 
}()); 

L'ordine degli allarmi sarà 1, 3, 2. setTimeout non chiamerà la sua callback in modo sincrono poiché si basa sull'attesa che trascorra il tempo specificato, quindi anche se non è previsto che scada il tempo, deve ancora attendere che la funzione corrente termini prima che possa continuare.

Answer 2

L'esecuzione di una chiamata Ajax quando si risponde a un evento client o in qualsiasi altro scenario consente di specificare il codice nei callback e il codice che viene eseguito immediatamente dopo la creazione del codice Ajax (non nel callback).

Esempio:

// Code before the ajax call is made 
$.ajax({ 
    params, //other key values such as data 
    success: function (data) { 
     // one of the possible callbacks 
    } 
}); 
// Code executed immediately after ajax call is performed 
// This is executed before or after the callback is complete 
// In most cases it's before 

Quindi, qualsiasi cosa eseguita prima della chiamata AJAX è fatta è garantito da eseguire prima. Qualsiasi cosa immediatamente dopo la chiamata ajax è quasi garantita per essere eseguita prima che venga richiamata la richiamata. Il callback è garantito per l'esecuzione dopo che il server ha restituito una risposta.