Les fonctions JavaScript asynchrones peuvent-elles être exécutées de manière synchrone sans geler l'interface utilisateur ?

Exécution synchrone de fonctions JavaScript asynchrones

Dans certaines situations, il peut être nécessaire d'exécuter des fonctions JavaScript asynchrones de manière synchrone, mais sans figer l'interface utilisateur . Bien que cela ne soit généralement pas considéré comme une bonne pratique, il existe des cas spécifiques où cela peut être jugé nécessaire.

Le défi

Le but est de bloquer la fonction jusqu'au rappel est appelé, sans geler l'interface utilisateur. Cela présente un défi car le blocage de JavaScript entraîne généralement le blocage de l'interface utilisateur.

Solution possible

Une solution possible consiste à utiliser l'interrogation pour vérifier une variable globale définie par le rappel. . Voici un exemple :

function doSomething() {

  // Callback sets received data to a global variable
  function callBack(d) {
    window.data = d;
  }

  // Start the async
  myAsynchronousCall(param1, callBack);
}

// Start the function
doSomething();

// Clear the global data
window.data = null;

// Poll at an interval until data is found in the global
var intvl = setInterval(function() {
  if (window.data) {
    clearInterval(intvl);
    console.log(data);
  }
}, 100);

Cette approche permet à la fonction appelante de bloquer jusqu'à ce que les données soient reçues du rappel, sans geler l'interface utilisateur. Cependant, cela suppose que la fonction doSomething() peut être modifiée pour utiliser la variable globale.

Bonne pratique

Il est important de noter que cette approche est considérée comme sous-optimale. solution. Idéalement, les appels asynchrones devraient être traités à l'aide de rappels ou de promesses, plutôt que de bloquer la fonction. Cependant, cela peut être nécessaire comme solution de contournement temporaire dans certaines bases de code qui ne peuvent pas être facilement modifiées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!