LocalStorage，JavaScript和Objects(LocalStorage, JavaScript and Objects)

LocalStorage，JavaScript和Objects(LocalStorage, JavaScript and Objects)

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

我的问题是在实际创建对象时：我在sessionStorage中有两个值需要添加到对象中，然后传递给localStorage。 但是，当我尝试创建对象时，会将一个值存储为变量名称而不是其（数值）值。 有什么想法在这里发生？

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

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

I need to store an object in localStorage - and I know that in order to do so, I have to convert the object into a string. All cool.

My problem is in actually creating the object in the first place: I have two values in sessionStorage that need to be added to the object which is then passed into localStorage. However, when I try to create the object, one value is being stored as the variable name rather than its (numeric) value. Any idea whats going on here?

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

The first alert confirms that siteID is indeed a number type, but the second alert shows that the variable name (siteID) is stored rather than its numeric value.

最满意答案

这一行：

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中的字符串[暂时]。）

This line:

var temp = {siteID:siteName};

...creates an object containing a property called siteId with the value taken from the siteName variable.

If you want the property name to be taken from the siteID variable instead:

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

Or in ES2015 (aka "ES6") you could use the new computed property name syntax:

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

In JavaScript, you can access/create properties on objects in two different but equal ways: Using dotted notation with a literal property name:

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

...or using bracketed notation and a string:

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

The keys in object initializers like your var temp = {siteID:siteName}; are always used literally (although they can optionally be in quotes); there's no way with an object initializer to have a key taken from a variable instead. So you have to do it as a two-step process, first create the object, then set the property.

So, if you do

temp[siteID] = siteName;

...the number in siteID will be converted to a string and will become the property name, with the value of siteName being the value.

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

(Property names are always strings in JavaScript [for now].)