JavaScript 显示逻辑运算的错误结果

Question

我有一个 Chrome 扩展程序。它的代码有一个方法getSelectionFromPage()它捕获网页上选定的文本，并且始终 returns true如下所示:

function getSelectionFromPage() {
  window.selected = true;
  chrome.tabs.executeScript({
  code: "window.getSelection().toString();"
 }, function(selection) {
  if (selection[0] != '') {
    window.selected = true;
  }else{
    window.selected = false;
  }
 });
 return true
}

在同一窗口上下文中，我在控制台上运行了以下命令。
结果如下:

我也在此处编写相同的命令:

getSelectionFromPage() //-> true
window.selected //-> false
(getSelectionFromPage() && window.selected) //-> true

(getSelectionFromPage() && window.selected)应该是false 。我尝试过检查typeof(window.selected)和typeof(getSelectionFromPage())两者都返回boolean 。我不明白为什么会这样。

Answer 1

设置为 false 的函数是回调。直到当前执行上下文完成后才会执行。因此，直到 && window.selection 执行完成后，它才会被设置为 false。

executeScript 文档:https://developer.chrome.com/extensions/tabs#method-executeScript

事情的顺序是:

(function () {
  window.selected = true; // Runs
  chrome.tabs.executeScript({code: "window.getSelection().toString();"}, function(){
    window.selected = false;
  }); // Calls browser API and  set's callback (the anonymous function there) to call later)
  // NOTE: the callback function which was set here was NOT executed yet it was only defined.
  return true;
})() // true
&& window.selected // this is currently true
// Later, now callback executes

如果您想等待，可以使用 Promise 代替。

  function getSelectionFromPage() {
    return new Promise(function (resolve) {
      chrome.tabs.executeScript(
        {code: "window.getSelection().toString();"},
        // or just put resolve here instead of defining a function to get value directly
        function(v){
          resolve(!!v);
        }
      );
    });
  }

  getSelectionFromPage().then(haveSelection => console.log(haveSelection);