Pourquoi mon résultat « chrome.tabs.query » semble-t-il indisponible après un appel ?

Nature asynchrone de chrome.tabs.query : pourquoi les résultats semblent indisponibles après l'appel

Lors du développement d'une extension pour Google Chrome, récupération des informations sur les onglets l'utilisation de chrome.tabs.query implique souvent de créer un tableau (fourmTabs) pour stocker les données de l'onglet, puis d'accéder à son contenu. Cependant, un comportement inattendu peut survenir lorsque ce code n'est pas correctement ajusté à la nature asynchrone de chrome.tabs.query.

Considérez l'exemple suivant :

<code class="javascript">var fourmTabs = new Array();
chrome.tabs.query({}, function (tabs) {
  for (var i = 0; i < tabs.length; i++) {
    fourmTabs[i] = tabs[i];
  }
});
for (var i = 0; i < fourmTabs.length; i++) {
  if (fourmTabs[i] != null)
    window.console.log(fourmTabs[i].url);
  else {
    window.console.log("??" + i);
  }
}</code>

Dans cet exemple, le code tente d'imprimer l'URL de chaque onglet du tableau après l'exécution du rappel chrome.tabs.query. Cependant, lorsqu'elle est exécutée sans points d'arrêt, la console reste vide, tandis que l'utilisation de points d'arrêt donne les résultats attendus.

Ce problème survient car chrome.tabs.query est une fonction asynchrone, ce qui signifie que son rappel est exécuté indépendamment du code suivant. . Lorsque des points d'arrêt sont utilisés, l'exécution du code s'arrête au premier point d'arrêt, permettant au rappel de se terminer avant l'exécution de la deuxième boucle. Sans points d'arrêt, la deuxième boucle s'exécute immédiatement après la première, avant que le rappel chrome.tabs.query n'ait eu le temps de collecter les données de l'onglet. Par conséquent, le tableau fourmTabs est vide lorsqu'il est accédé dans la deuxième boucle.

Pour résoudre ce problème et garantir le bon fonctionnement du code, il est nécessaire de déplacer la deuxième boucle dans la fonction de rappel de chrome.tabs.query. De cette façon, l'exécution de la deuxième boucle est garantie de se produire uniquement après la récupération des données de l'onglet :

<code class="javascript">chrome.tabs.query({}, function (tabs) {
  var fourmTabs = new Array();
  for (var i = 0; i < tabs.length; i++) {
    fourmTabs[i] = tabs[i];
  }
  for (var i = 0; i < fourmTabs.length; i++) {
    if (fourmTabs[i] != null)
      window.console.log(fourmTabs[i].url);
    else {
      window.console.log("??" + i);
    }
  }
});</code>

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!