Opzioni di sincronizzazione JavaScript

Question

Mi chiedevo se esiste una soluzione per eseguire la sincronizzazione nel codice JavaScript. Ad esempio, ho il seguente caso: sto tentando di memorizzare alcuni valori di risposta dalla chiamata AJAX, il problema è che è possibile eseguire contemporaneamente più chiamate, quindi porta a condizioni di competizione nel codice. Quindi sono molto curioso di trovare una soluzione per questo? Qualcuno ha idea che fare?

Answer 1

Ho trovato la soluzione per il mio problema. Devo dire che non è perfetto come stavo cercando, ma finora funziona e ci penso più come temporaneamente a lavorare.

$.post("url1", function(data) 
{ 
    // do some computation on data and then 
    setSomeValue(data); 
}); 

var setSomeValue = (function() 
{ 
    var cache = {}; 
    return function(data) 
    { 
     if (cache[data] == "updating") 
     { 
      setTimeout(function(){ setSomeValue(data);}, 100); 
      return; 
     } 
     if (!cache[date]) 
     { 
      cache[date] = updating; 
      $.post("url2", function(another_data) 
      { 
        //make heavy computation on another_data 
        cache[data] = value; 
        // update the UI with value 
      }); 
     } 
     else 
     { 
      //update the UI using cached value 
     } 
    } 
})(); 

Answer 2

Javascript è intrinsecamente a thread singolo, almeno per il normale ambiente del browser. Non ci saranno mai due esecuzioni simultanee di script che accedono allo stesso documento. (I nuovi thread di lavoro di Javascript potrebbero essere un'eccezione qui, ma non sono pensati per accedere ai documenti affatto, solo per comunicare passando il messaggio).

Answer 3

Sì, è possibile rendere sincrono xmlHttpRequests, in non-IE impostare asynch option su falso sul metodo aperto, nei browser IE do the same con il parametro bAsync.

Forse potresti voler concatenare le tue richieste in qualche modo. Crea uno stack di que e invia le richieste mentre fai la coda.

Answer 4

Innanzitutto, è importante sapere che tutte le implementazioni JS correnti sono a thread singolo, pertanto non stiamo discutendo le condizioni di gara e la sincronizzazione nel contesto in cui viene solitamente utilizzata.

Come nota a margine, i browser stanno ora introducendo thread di lavoro che consentiranno la concorrenza in JS, ma per ora questo non è il caso.

Ad ogni modo, si riscontrano ancora problemi con i dati che si prevede di ricevere in risposta alle chiamate asincrone e non si ha alcuna garanzia sull'ordine in cui si riceveranno le cose.

JS offre una soluzione molto bella a questo con i callback. Per ogni evento asincrono che invierai, allega una funzione di callback appropriata, che gestirà l'evento correttamente. Sincronizzazione, nel modo in cui lo intendi, dovrebbe accadere lì.

Answer 5

Posso offrire una possibile soluzione, ma senza vedere il codice ... non sono completamente sicuro di quello che stai facendo, ma non c'è motivo per cui non potresti farlo.

codice di base in jQuery: (non testato e abbreviata ... ma ho fatto cose simili)

var needAllThese = {}; 

$(function(){ 

     $.ajax("POST","/somepage.aspx",function(data) { 
      needAllThese.A = "VALUE"; 
     }); 

     $.ajax("POST","/somepage2.aspx",function(data) { 
      needAllThese.B = "VALUE"; 
     }); 

     $.ajax("POST","/somepage3.aspx",function(data) { 
      needAllThese.C = "VALUE"; 
     }); 

     startWatching(); 
}); 

function startWatching() { 
    if (!haveEverythingNeeded()) { 
     setTimeout(startWatching,100); 
     return; 
    } 
    everythingIsLoaded(); 
} 

function haveEverythingNeeded() { 
    return needAllThese.A && needAllThese.B && needAllThese.C; 
} 

function everythingIsLoaded() { 
    alert("Everything is loaded!"); 
} 

EDIT: (re: il tuo commento)

siete alla ricerca di callback, nello stesso modo in cui lo farebbe jQuery.

var cache = {}; 

    function getSomeValue(key, callback) { 
     if (cache[key]) callback(cache[key]); 

     $.post("url", function(data) { 
      setSomeValue(key,data); 
      callback(cache[key]); 
     }); 
    } 

    function setSomeValue(key,val) { 
     cache[key] = val; 
    } 

    $(function(){  
     // not sure you would need this, given the code above 
     for (var i = 0; i < some_length; ++i) { 
      $.post("url", function(data){ 
       setSomeValue("somekey",data); 
      }); 
     } 

     getSomeValue("somekey",function(val){    
      $("#element").txt(val);    
     };    
    }); 

Answer 6

So che è molto tempo dopo, ma ho pensato di dare un miglioramento. Artem Barger ha elaborato la propria soluzione che utilizza setTimeout se il valore memorizzato nella cache è "in fase di aggiornamento" ... Contrassegna semplicemente la funzione su una coda collegata rispetto al valore memorizzato nella cache in modo da avere un oggetto che contiene i dati memorizzati nella cache e la coda delle funzioni chiamare con i dati memorizzati nella cache una volta restituiti i dati.

Quindi, se è "aggiornamento" basta aggiungere la funzione alla coda che è collegata ai dati dell'articolo e quando i dati restituiti ...imposta i dati e poi itera sulla coda delle funzioni (callback) e chiamali con i dati restituiti.

se si desidera ottenere informazioni tecniche, è possibile impostare un timeout QOS specifico mentre si passa attraverso la coda, impostare un cronometro all'inizio dell'iterazione e, se si raggiunge un orario specifico, chiamare un setTimeout per tornare nel coda per continuare l'iterazione ... spero che tu l'abbia capito :) - In pratica, salva la quantità X delle chiamate setTimout ne è necessaria solo una.

Visualizza il codice Artem Bargers sopra e dovresti ottenere il succo di ciò che propongo.