JS：異步API，最終結果始終爲空

Question

我正在使用異步服務並從中獲取數據。這部分是好的，但是當我嘗試設置這些數據，然後從對象中獲取 - 空值。 請在下面檢查我的代碼，爲什麼getPage（）返回false？

var PageName = function() { 
    this.page = false; 

    this.getPage = function() { 
     return this.page; 
    }; 

    this.setPage = function(pageId) { 
     this.page = pageId; 
     console.log(pageId); //Get correct result 
    }; 

    this.savePage = function(callback) { 
     chrome.storage.sync.get('pageId', function (obj) { 
      pageId = obj.pageId; 
      callback(pageId); 
     }); 
    }; 
}; 

var page = new PageName(); 
page.savePage(page.setPage); 

setInterval(function(){ 
    console.log(page.getPage()); //always get default result - false 

}, 4000); 

Answer 1

page.setPage需要綁定到頁面。看看這個網站的第一個例子https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind 另外，你也可以根本不使用this。那麼你不需要綁定這個函數。 例如

var PageName = function() { 
    var page = false; 

    function getPage() { 
     return page; 
    } 
    function setPage(pageId) { 
     page = pageId; 
    } 
    function savePage(callback) { 
     chrome.storage.sync.get('pageId', function (obj) { 
      setPage(obj.pageId); 
      callback(obj.pageId); 
     }); 
    } 

    return { 
     getPage: getPage, 
     setPage: setPage, 
     savePage: savePage 
    }; 
} 

var page = PageName(); 
page.savePage(function(pageId) { 
    console.log("pageId = " + pageId); 
    console.log("page.getPage() = " + page.getPage()); 
}); 

在這個例子中，我還刪除了使用setInterval因爲我不認爲它使多大意義。 btw。這裏有一些關於javascript對象創建模式的iteresting文章。 http://www.samselikoff.com/blog/some-Javascript-constructor-patterns http://www.codeproject.com/Articles/687093/Understanding-JavaScript-Object-Creation-Patterns