JavaScript LocalStorage of Array with String Keys

Question

If i save my array in the localStorage the values saved with String keys are getting lost.

Example:

var myArray = [];

myArray["key1"] = "value1";
myArray[123] = "value2";

Everything works and the output of the following works:

myArray["key1"] => value1
myArray[123] => value2

Now if i store the array with something like:

localStorage.setItem('myStoredArray',JSON.stringify(myArray));
var myArray = JSON.parse(localStorage.getItem('myStoredArray'));

The output is missing the value assigned with a String Key:

myArray["key1"] => undefined
myArray[123] => value2

Am i doing something wrong ,should it work or is there another way to save it that i have my values assigned with String keys?

Thanks in advance!

I missed it in my example. That's not the problem. Otherwise the rest wouldn't have worked — Jonas
– Jonas, Commented May 2, 2016 at 12:17
there are no associative arrays in javascript. you should use an object. — Daniel A. White
– Daniel A. White, Commented May 2, 2016 at 12:19
You are adding a property to an array object. It's not serialized as JSON. So the parsed/new array doesn't have such property. That's not how JSON works. — Ram
– Ram, Commented May 2, 2016 at 12:22

Daniel A. White · Accepted Answer · 2016-05-02 12:21:05Z

3

There is no associative arrays in JavaScript. You should be using an object which will convert all keys to strings.

var myObj = {}; // <<< change here

myObj["key1"] = "value1";
myObj[123] = "value2";

answered May 2, 2016 at 12:21

Daniel A. White

192k49 gold badges389 silver badges473 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Thank you very much. I'll accept this as soon as it lets me!

Aaron · Accepted Answer · 2020-09-08 09:26:32Z

2

As stated by Daniel in the comments, your array isn't just badly persisted, it's badly created.

You can easily see it in your browser's console :

>var myArray = [];
<undefined
>myArray["key1"] = "value1";
<"value1"
>myArray
<[]

As you can see, trying to assign a value to an array through a String key doesn't work.

You can try using ES6 Maps or an object.

Since Daniel already answered with the Object method, here's the Map one :

var myMap = new Map();
myMap.set("key1", "value1");
myMap.set("123", "value2");

And the advantage of a Map is a somewhat easier iteration :

for (var [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}

answered May 2, 2016 at 12:22

Aaron

24.9k2 gold badges41 silver badges61 bronze badges