从localStorage检索数据

Question

我正在尝试从localStorage中检索一个正在工作的字符串，但我不确定执行的顺序。或者我遗漏了什么。

//content_script.js

function getSize(){
    chrome.extension.sendMessage({method: "getSize"}, function(response){
        size = response.sizeIs; 
    });
    alert(size);
    return size;
}

和

//background.js

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.method == "getSize")
        sendResponse({sizeIs: localStorage['size']});
});

警报消息如下：

undefined
Large

分别使用。

所以我想我的问题是，为什么变量在sendMessage函数中工作，而不在外部呢？

Answer 1

这是因为在您的示例中，alert(size);在size = response.sizeIs;之前执行

应该是这样的：

function getSize(callback){
  chrome.extension.sendMessage({method: "getSize"}, function(response){
    size = response.sizeIs; 
    callback(size);
  });
}

然后这样称呼它：

getSize(function(size) {
  alert(size);
});

而不是：

size = getSize();
alert(size);

chrome.extension.sendMessage是异步(非阻塞)方法，这意味着您无法立即获得结果。您必须在内部传递一个回调函数和处理结果。

这就像setTimeout函数。尝试执行以下代码：

setTimeout(function() {
  console.log('test 1');
}, 100);
console.log('test 2');

你会进入你的控制台：

test 2
test 1

在这种情况下，test 2立即显示和test 1 -在100毫秒后。这就是异步函数/方法的工作方式。

这里您可以阅读有关异步函数的更多信息。