Comment puis-je appeler efficacement des fonctions JavaScript asynchrones sans bloquer l'interface utilisateur ?

Appel de fonctions JavaScript asynchrones de manière synchrone

Votre besoin de rendre les appels asynchrones synchrones sans geler l'interface utilisateur présente un problème unique et difficile. Malheureusement, bloquer l'exécution de JavaScript sans arrêter l'interface utilisateur n'est pas réalisable.

Une solution potentielle consiste à utiliser des variables globales pour l'échange de données. Le rappel de l'appel asynchrone peut modifier une variable globale contenant les données souhaitées. Pendant ce temps, un mécanisme d'interrogation vérifie la variable globale à intervalles réguliers jusqu'à ce que les données soient disponibles.

function doSomething() {
  window.data = null;  // Clear global data
  myAsynchronousCall(param1, callBack);
  var intvl = setInterval(function() {
    if (window.data) {
      clearInterval(intvl);
      console.log(window.data);
    }
  }, 100);
}

function callBack(d) {
  window.data = d;
}

Cependant, une solution plus appropriée, compte tenu de l'exemple que vous avez fourni, serait de suivre les meilleures pratiques et de transmettre un rappel. function to doSomething() :

function doSomething(func) {
  function callBack(d) {
    func(d);
  }

  myAsynchronousCall(param1, callBack);
}

doSomething(function(data) {
  console.log(data);
});

En passant une fonction à doSomething(), vous pouvez utiliser correctement les appels asynchrones sans recourir à des techniques.

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!