How do I delete an object or array from localStorage?

Question

I know that with localStorage.removeItem(key) I can remove an item by key. If my localStorage were single-dimensional (i.e. localStorage.search_near = 60654), that would be fine.

But I have multilevel values.

My localStorage.storedAddresses contains json objects:

[{
    "storeNumber": "010517",
    "zip": "20500",
    "state": "DC",
    "city": "WASHINGTON",
    "address": "1600 Pennsylvania Ave",
    "zone": null,
    "address_two": null,
    "name": "Second Choice",
    "type": "P",
    "dwellCode": "P",
    "key": 4,
    "defaultLocation": "N"
},
{
    "storeNumber": "714389",
    "zip": "60202",
    "state": "IL",
    "city": "EVANSTON",
    "address": "818 Brown Ave",
    "zone": null,
    "address_two": null,
    "name": "Test Storage",
    "type": "P",
    "dwellCode": "P",
    "key": 3,
    "defaultLocation": "N"
},
{
    "storeNumber": "316740",
    "zip": "70810",
    "state": "LA",
    "city": "BATON ROUGE",
    "address": "9884 BLUEBONNET BLVD",
    "zone": null,
    "address_two": null,
    "name": "Test2",
    "type": "P",
    "dwellCode": "P",
    "key": 2,
    "defaultLocation": "N"
}]

How would I go about using localStorage.removeItem() to remove just the object where storeNumber is 714389? Do I have to loop through localStorage.storedAddresses and compare the storeNumber values, and then use removeItem when it finds the match? Or is there a more direct way?

You might want to reconsider your data structure here. localStorage can only store strings. Yes, this allows you to store JSON strings, however if you actually want to interact with the data structure serialized to JSON, you will need to deserialize it and then work with it. That could be a lot of overhead. Why not store an entry for each store number directly? — Mike Brant, Apr 16 '14 at 16:30
Because these are customer's saved addresses, and we need to interact with them as a whole many times - i.e. populate dropdown boxes. It's easier to just grab `localStorage.storedAddresses` than to have to figure out which items we want. — EmmyS, Apr 16 '14 at 16:32
OK. Even so, you may want to consider changing your data structure to be an object with store number values as keys to nested object with the rest of the data. Without this, you will need to iterate the entire array of object to find the store you are looking for. — Mike Brant, Apr 16 '14 at 16:48

fiction · Answer 1 · 2014-04-16T16:34:54.613

2

Since localstorage can only store strings, you have to parse the value using JSON.parse and manually remove it, then reinsert.

var storedAddresses = JSON.parse(localStorage.storedAddresses); 
// storedAddresses is now an array of objects, not just a string

for ( var i = 0; i < storedAddresses.length; i++ ) {
    if ( storedAddresses[i].storeNumber === '714389' ) {
        // remove the object with storeNumber '714389' from the array
        storedAddresses.splice(i,1); 
    }
}

// insert the new stringified array into LocalStorage
localStorage.storedAddresses = JSON.stringify(storedAddresses);

edited Apr 16 '14 at 16:34

answered Apr 16 '14 at 16:24

fiction

1,078
8
11

I don't understand. What am I reinserting? – EmmyS Apr 16 '14 at 16:25
@EmmyS I commented the code, I hope it's easier to understand. – fiction Apr 16 '14 at 16:37

score 0 · Answer 2 · edited May 23 '17 at 12:04

0

If you are using jQuery, you may want to use grep which is used for searching the arrays. See this for more information:

Find object by id in an array of JavaScript objects

You can also use these libraries to query a JSON structure:

http://orangevolt.blogspot.com/2012/12/8-ways-to-query-json-structures.html

edited May 23 '17 at 12:04

Community

1
1

answered Apr 16 '14 at 16:50

advncd

3,787
1
25
31

How do I delete an object or array from localStorage?

2 Answers2