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
– drew_w, Commented Jan 5, 2014 at 17:10

serakfalcon · Accepted Answer · 2014-01-05 18:13:59Z

7

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));
}

edited Jan 5, 2014 at 18:13

answered Jan 5, 2014 at 17:15

serakfalcon

3,5311 gold badge25 silver badges35 bronze badges

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

1 Comment

Prinzhorn Over a year ago

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

Pointy · Accepted Answer · 2014-01-05 18:23:19Z

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 5, 2014 at 18:23

answered Jan 5, 2014 at 17:11

Pointy

415k62 gold badges600 silver badges631 bronze badges

7 Comments

Pointy Over a year ago

@user2567857 the problem may be that you're not actually saving the object successfully.

user2567857 Over a year ago

You mean the variable data ?

Pointy Over a year ago

@user2567857 no - if "a" is ending up null then that means that there wasn't anything in local storage with the key "session".

user2567857 Over a year ago

Yeah, that it because the solution I am following (as pointed out in my question), is doing getItem first and then setItem

Pointy Over a year ago

@user2567857 OK answer extended with a possibility.

|

Collectives™ on Stack Overflow

Cannot push objects in array in localStorage

2 Answers 2

1 Comment

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related