为什么我的`chrome.tabs.query`结果在调用后显示不可用？

chrome.tabs.query 的异步特性：为什么调用后结果显示不可用

在开发 Google Chrome 扩展程序时，检索选项卡信息使用 chrome.tabs.query 通常涉及创建一个数组 (fourmTabs) 来存储选项卡数据，然后访问其内容。但是，如果未针对 chrome.tabs.query 的异步性质正确调整此代码，则可能会出现意外行为。

请考虑以下示例：

<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>

在此示例中，代码执行 chrome.tabs.query 回调后尝试打印数组中每个选项卡的 URL。然而，当没有断点运行时，控制台保持为空，而使用断点会产生预期结果。

出现此问题是因为 chrome.tabs.query 是一个异步函数，这意味着它的回调是独立于后续代码执行的。使用断点时，代码执行会在第一个断点处暂停，从而允许回调在执行第二个循环之前完成。如果没有断点，第二个循环将在第一个循环之后立即执行，然后 chrome.tabs.query 回调有时间收集选项卡数据。因此，在第二个循环中访问 fourmTabs 数组时，其为空。

要解决此问题并确保代码正确运行，需要将第二个循环移至 chrome.tabs.query 的回调函数内。这样，保证仅在检索到选项卡数据后才执行第二个循环：

<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>

以上是为什么我的`chrome.tabs.query`结果在调用后显示不可用？的详细内容。更多信息请关注PHP中文网其他相关文章！