javascript - 如何将变量传递到全局范围

Question

问题 - 如何将变量传递给全局范围？：

var global_variable;

chrome.storage.local.get('ABC',function(result){
            global_variable = result; //pass result to global var.
});

console.log(global_variable); //outputs undefined, why!!!?

Answer 1

这只是因为在设置全局变量console.log()之前启动。 因为是异步启动的。'ABC',function(result){
chrome.storage.local.get

要验证它，请测试此代码：

var global_variable;
chrome.storage.local.get('ABC',function(result){
        global_variable = result; //pass result to global var.
        test();
});
function test() {
    console.log(global_variable);
}

Answer 2

您正在异步函数回调中设置变量。回调在 get 操作完成后运行。

您的代码将按以下顺序执行：

chrome.storage.local.get("ABC",callback);

然后

console.log();

然后

callback()

您可以通过在回调中放置一个 console.log 语句并查看它在当前语句之后运行来验证这一点。

Javascript 函数在运行任何异步回调调用之前运行完成。

像这样写可能更有意义，这相当于你现在所拥有的。

//define the callback
function callbackFunction(result){
      global_variable = result; //pass result to global var.
}

//run the get.  When it is complete the callback will be added to a queue 
//to run next after current operations have completed
chrome.storage.local.get('ABC',callback);

// this will run immediately after the get call
console.log(global_variable);

如果要使用变量，则必须将逻辑放在回调中（或回调调用的单独函数中。

Answer 3

我假设，不知道“结果”的返回值是什么，您希望将一个值传递给全局范围的一个尚未预定义的变量。以下回调更改将定义一个具有全局范围的新变量，并将“结果”的值分配给它。请记住，该范围与窗口对象中的层次结构有关，而不是与脚本有关。

function callbackFunction(result){
    window.global_variable = result;
}
console.log(global_variable);

您还可以动态注入脚本标签，其中 src 属性是您的全局值。

function callbackFunction(result){
    var js = document.createElement('script');
    js.src = 'var global_variable = ' + result + ';';
    var first = document.getElementsByTagName('script')[0];
    first.parentNode.insertBefore(js, first);
}

尽管我认为这对于实现相同的结果似乎有点冗长。