Cannot push objects in array in localStorage

Question

I am trying to store localStorage value in array and following this page Push JSON Objects to array in localStorage. My code is:

function SaveDataToLocalStorage(data)
{
 var a = [];
 // Parse the serialized data back into an aray of objects
 a = JSON.parse(localStorage.getItem('session'));
 // Push the new data (whether it be an object or anything else) onto the array
 a.push(data);
 // Alert the array value
 alert(a);  // Should be something like [Object array]
 // Re-serialize the array back into a string and store it in localStorage
 localStorage.setItem('session', JSON.stringify(a));
}

where data is:

 var data = {name: "abc", place: "xyz"}

I am getting the following error:

 Uncaught TypeError: Cannot call method 'push' of null

Can anybody show the correct method to store localStorage values in array?

The variable "a" must be null. Use the debugger in your browser and check the value before the push call is run. I think that should put you on the right track — drew_w, Jan 05 '14 at 17:10

serakfalcon · Accepted Answer · 2014-01-05T18:13:59.117

null is a special value for objects that aren't initialized to anything. My guess is that localStorage.getItem('session') is empty.

a more robust answer would be something like

function SaveDataToLocalStorage(data)
{
    var a;
    //is anything in localstorage?
    if (localStorage.getItem('session') === null) {
        a = [];
    } else {
         // Parse the serialized data back into an array of objects
         a = JSON.parse(localStorage.getItem('session'));
     }
     // Push the new data (whether it be an object or anything else) onto the array
     a.push(data);
     // Alert the array value
     alert(a);  // Should be something like [Object array]
     // Re-serialize the array back into a string and store it in localStorage
     localStorage.setItem('session', JSON.stringify(a));
}

`var a = JSON.parse(localStorage.getItem('session')) || [];` — Prinzhorn, Jan 05 '14 at 17:19

Pointy · Answer 2 · 2014-01-05T18:23:19.497

1

You're overriding the initial empty array that initializes "a" when you fetch the local storage contents. The variable is declared and initialized:

var a = [];

and then that empty array is immediately thrown away:

a = JSON.parse(localStorage.getItem('session'));

After that, it appears that your retrieved value is actually empty (null) if you're getting that error.

If you want "a" to be either a new empty array, or else an array saved in local storage, you'd do something like this:

var a = localStorage.getItem('session') || "[]";
a = JSON.parse(a);

edited Jan 05 '14 at 18:23

answered Jan 05 '14 at 17:11

Pointy

405,095
59
585
614

@user2567857 the problem may be that you're not actually saving the object successfully. – Pointy Jan 05 '14 at 17:17
You mean the variable `data` ? – user2567857 Jan 05 '14 at 17:19
@user2567857 no - if "a" is ending up `null` then that means that there wasn't anything in local storage with the key "session". – Pointy Jan 05 '14 at 17:20
Yeah, that it because the solution I am following (as pointed out in my question), is doing `getItem` first and then `setItem` – user2567857 Jan 05 '14 at 17:25
@user2567857 OK answer extended with a possibility. – Pointy Jan 05 '14 at 18:23
It's showing `Unexpected token H ` error in line `a = JSON.parse(a); ` if I set `var a` as recommended by you – user2567857 Jan 05 '14 at 18:31
@user2567857 well what's in local storage then? Do a `console.log(a)` right before that line. – Pointy Jan 05 '14 at 18:37

Cannot push objects in array in localStorage

2 Answers2

Linked