javascript - Chrome 扩展程序 : query tabs async

Question

我有两个变量被设置为函数的“返回值”，这些函数是获取选项卡的 URL 和对实际选项卡对象的引用，并将它们存储在变量中。我有一些代码:

function init(){
    var url = getUrl();
    var tab = getTab();
}

function getUrl(){
    var tablink;
    chrome.tabs.query({currentWindow: true, active: true},function(tabs){
        tablink = tabs[0].url;
        return tablink;
    });

}

function getTab(){
    var tab;
    chrome.tabs.query({currentWindow: true, active: true},function(tabs){
        tab = tabs[0];
    });
    return tab;
}

为什么 URL 未定义，虽然我从回调函数内返回 URL，但是当我从回调外部返回 tab 时，它返回正常，就好像这是一个同步调用一样。我有一个screenshot在调试器中发现这种现象。我正在尽力学习如何处理 chrome 中的异步方法，但这非常令人困惑。有人可以向我解释这种行为吗？

Answer 1

正如您已经说过的，chrome.tabs.query 函数是异步的。因此，您不能依赖 return，而必须使用回调。 Chrome 扩展程序的文档对此进行了很好的解释:http://developer.chrome.com/extensions/overview.html#sync-example

所以在你的情况下，类似的东西可能会起作用(取决于你以后想要用它做什么)。

var url, tab;
function init(){
    chrome.tabs.query({currentWindow: true, active: true},function(tabs){
       url = tabs[0].url;
       tab = tabs[0];
       //Now that we have the data we can proceed and do something with it
       processTab();
    });
}

function processTab(){
    // Use url & tab as you like
    console.log(url);
    console.log(tab);
}