如何使用变量的值作为键名在 chrome 扩展中使用 chrome.storage？

Posted 2023-03-05

【中文标题】如何使用变量的值作为键名在 chrome 扩展中使用 chrome.storage？

【英文标题】：How to use chrome.storage in a chrome extension using a variable's value as the key name?

【发布时间】：2012-10-07 04:57:15

【问题描述】：

我正在尝试将 chrome 的本地存储/同步存储 (chrome.storage) 用于扩展，以存储数据条目，用于许多不同的条目。我似乎无法弄清楚它的正确语法。我只想将信息简单地存储为字符串。我已经搜索过，但找不到任何可行的方法。

这就是目前使用普通 localStorage 技术对我有用的方法：

    var imageName = "Red Cat 5";
    var myDescription = "A nice kitty";

    localStorage.setItem (imageName, myDescription);
    console.log(localStorage[imageName]);

这很有效，让我可以从现有变量中设置密钥。 我怎样才能使用 chrome.storage.local.set 做到这一点？ 我一直在尝试这个没有任何成功：

    var imageName = "Red Cat 5";
    var myDescription = "A nice kitty";

    chrome.storage.local.set(imageName: myDescription, function()
    console.log('success?'););

    chrome.storage.local.set(imageName: myDescription, function()
    chrome.storage.local.get(imageName, function(r)console.log(r.imageName);););

非常感谢任何帮助。谢谢！

-- 下面更新 -----

感谢代码的解释。我希望它可以帮助其他人。似乎很少有关于这样做的信息！你的回答帮助我想出了这个：

    var nameOne = "al";
    var nameTwo = "bob";
    var nameThree = "carl";
    var nameFour = "dan";

    var dataObj = ;

    dataObj[nameOne] = nameTwo;
    dataObj[nameThree] = nameFour;

    storage.set(dataObj);

    storage.get(dataObj, function(result)
    
    console.log(result[nameOne]);
    console.log(result[nameThree]);
    );

【参考方案1】：

使用命名对象，而不是匿名对象，并使用方括号设置成员变量：

var dataObj = ;
dataObj[imageName] = myDescription;
chrome.storage.local.set(dataObj, function()  /*...*/ );

这不是最优雅的代码，但它是唯一的方法。

在 ES6 中，一个稍微短一些的方法是使用带有动态属性名称的对象字面量：

chrome.storage.local.set(
    [imageName]: myDescription
, function()  /*...*/ );

【讨论】：

您好，感谢您提供此信息。它使它更容易理解。在您的帮助下，我想出了一些似乎可以满足我需要的东西！有关示例，请参见上面的问题。

顺便说一句...是否可以在一个命令中使用您的答案中的三行代码，而无需功能部分？

您可以将它包装在像setlocalData(keyNameString, value, callback) 这样的函数中，它使用我发布的三行版本。除此之外，不是，我不这么认为。

@rich 对象文字只能有文字属性名称。在这里，我们需要一个可变 命名的属性。假设您想要一个名为bazzle 的字面名称属性；您可以使用bazzle:5 或o = ; o["bazzle"] = 5;。但是，如果你不知道你想要的属性的名称（即它存储在一个变量中），你只能做第二种情况o[stringWithPropertyName] = 5;。对象字面量无法使用变量作为属性名。即，stringWithPropertyName:5 将使用冒号左侧的文字字符串。

@onegrx 该函数是一个回调，在存储操作完成后运行。

【参考方案2】：

set 方法接受 对象项 和一个可选回调，get 接受 可选字符串或数组或对象键，如果您传递了第一个参数，你也必须传递第二个参数。

例子：

// To set 
chrome.storage.local.set('testKey':'Test Value');

// To get
chrome.storage.local.get('testKey', function(data)
  console.log(data); 
  // logs out "Object testKey: "Test Value""
)