LocalStorage、JavaScript 和对象

Question

我需要在 localStorage 中存储一个对象 - 我知道为了这样做，我必须将对象转换为字符串。很酷。

我的问题首先在于实际创建对象：我在 sessionStorage 中有两个值需要添加到对象中，然后将其传递到 localStorage。但是，当我尝试创建对象时，一个值被存储为变量名而不是它的（数字）值。知道这里发生了什么吗？

var siteName = sessionStorage['1'];
var siteID = (+sessionStorage['2']);
var temp = {siteID:siteName};
alert(typeof siteID);
alert(JSON.stringify(temp));

第一个警报确认 siteID 确实是数字类型，但第二个警报显示存储的是变量名称 (siteID) 而不是其数值。

Answer 1

这一行：

var temp = {siteID:siteName};

...创建一个对象，其中包含一个名为 siteId 的属性，其值取自 siteName 变量。

如果您希望属性名称取自 siteID 变量：

var temp = {};
temp[siteID] = siteName;

或者在 ES2015（又名“ES6”）中，您可以使用新的 计算属性名称 语法：

// ES2015+ only!
var temp = {[siteId]: siteName};

在 JavaScript 中，您可以通过两种不同但相同的方式访问/创建对象的属性： 使用带有文字属性名称的点分表示法：

obj.foo = "bar";    // Creates a `foo` property on `obj` with the value `"bar"`

...或使用括号表示法和字符串：

obj["foo"] = "bar"; // Does the same thing

像var temp = {siteID:siteName}; 这样的对象初始化器中的键总是按字面意思使用（尽管它们可以选择用引号括起来）；对象初始化器无法从变量中获取键。所以你必须分两步进行，首先创建对象，然后设置属性。

所以，如果你这样做了

temp[siteID] = siteName;

...siteID 中的数字将转换为字符串，成为属性名称，siteName 的值就是值。

var temp = {};
var key = 1;
temp[key] = "value";
console.log(temp[1]); // "value"
console.log(temp["1"]); // "value"

（属性名称在 JavaScript [暂时] 中始终是字符串。）

Answer 2

改成这个。

var temp = {};

temp[siteName] = siteID;

或者，如果 typeof 测试旨在显示属性名称，您可以将它们反转。

var temp = {};

temp[siteID] = siteName;

但请注意，siteID 从那时起被视为字符串。