Chrome擴展存儲自定義對象類型帶原型方法

Question

我已經創建了我在擴展中使用的自定義對象。當我保存Group類型的對象（我的對象類型），然後將這些對象從存儲中取出時，看起來原型方法不再存在。現在我在文檔中讀到對象序列化爲對象文字{}，我似乎無法弄清楚如何保持對象的方法。我已經提供了下面的組類的代碼。當我嘗試從存儲中檢索到的對象上使用下面文件中的某個方法時，出現該函數不存在的錯誤。我使用了for循環來遍歷所有的屬性，並且對象具有名稱和url屬性。任何幫助將不勝感激！

Group.js：

// Create the Group class 
var Group = function (name, urls) { 
    this.name = name; 
    this.urls = urls; 
}; 

// Clears all urls from the group 
Group.prototype.clearUrls = function() { 
    this.urls = []; 
}; 

// Adds the specified url to the group 
Group.prototype.addUrl = function (url) { 
    this.urls.append(url); 
}; 

// Removes the specified url from the group 
Group.prototype.removeUrl = function (url) { 
    this.urls = this.urls.filter(function(_url){ 
    return url !== _url; 
    }); 
}; 

// Renames the group 
Group.prototype.rename = function (name) { 
    this.name = name; 
}; 

// Checks whether or not the group contains the specified url 
// Returns either true or false 
Group.prototype.containsUrl = function (url) { 
    var contains = false; 
    for (var i = 0; i < this.urls.length; i++) { 
    if (this.urls[i] === url) { 
     contains = true; 
     break; 
    } 
    } 
    return contains; 
}; 

編輯：

這裏是background.js腳本，它顯示了對象是如何檢索，然後它是如何在後面的腳本調用。它在收到addUrl消息並嘗試在currentGroup上調用containsUrl()時失敗。

// Global Variables 
var currentGroup; 
var groups = []; 
var options = []; 

// Short hand function to save the current data to storage 
var saveData = function() { 
    // Save default options, currrentGroup, and groups 
    chrome.storage.sync.set({'options': options, 'currentGroup': currentGroup, 'groups': groups}, function() { 
    if (chrome.runtime.lastError) { 
     console.error("Could not save because: " + chrome.runtime.lastError); 
    } 
    }); 
} 

// On start query for saved data to make sure data is current 
chrome.storage.sync.get(function(items) { 
    // Check if there are groups 
    if (items['groups']) { // Set the groups 
    groups = items['groups']; 
    } else { // Create default group and add to list of groups 
    currentGroup = new Group('default', []); 
    groups = [currentGroup]; 
    } 

    // Check for current group, if none set to first available group 
    if (items['currentGroup']) { 
    currentGroup = items['currentGroup']; 
    console.log(Object.getOwnPropertyNames(currentGroup)); 
    } else { 
    currentGroup = groups[0]; 
    } 

    // Check for the options 
    if (items['options']) { 
    options = items['options']; 
    } else { 
    // No options, set the default options and save them 
    options['overrideHomepages'] = true; 
    } 

    saveData(); 

    // After data has been fetched bring up the tabs 
    chrome.tabs.query({'currentWindow': true}, function(tabs) { 
    for (var i = 0; i < currentGroup.urls.length; i++) { 
     if (options['overrideHomepages']) { 
     if (tabs[i].url.length > 0) { 
      chrome.tabs.update(tabs[0].id, {'url': currentGroup.urls[i]}); 
     } else { 
      chrome.tabs.create({'url': currentGroup.urls[i]}); 
     } 
     } else { // Don't override homepages or open tabs 
     chrome.tabs.create({'url': currentGroup.urls[i]}); 
     } 
     currentGroup.urls[i] 
    } 
    }); // End tabs.query 

}); // End storage.sync.get 

// Add message listener 
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { 

    // If add url was sent 
    if (request.message === 'addUrl') { 
    console.log('Recieved message: ' + request.message); 
    // Check if the group contains the url already 
    if (currentGroup.containsUrl(sender.url) === false) { 
     currentGroup.addUrl(sender.url); 
     saveData(); 
     sendResponse({'message': 'Saved ' + sender.url}); 
    } 
    } 

    // If remove url was sent 
    if (request.message === 'removeUrl') { 
    // Check if the group contains the url 
    if (currentGroup.containsUrl(sender.url)) { 
     currentGroup.removeUrl(sender.url); 
     saveData(); 
     sendResponse({'message': 'Removed ' + sender.url}) 
    } 
    } 
}); 

Answer 1

我相信目前chrome.storage僅用於保存鍵值項，不包括原型/功能。但是，我沒有找到任何關於此的官方文檔。

一種解決方法是使用Group.prototype.containsUrl.call(currentGroup, sender.url)，它允許您調用containsUrl並指定"this"的上下文。