localStorage array of objects handling

2019-01-18 20:58发布

问题:

Array of JSON objects are stored in HTML5 localStorage.
For now delimiter is ;
For accessing and modifying array of objects from localStorage, split(';') and join(';') operations used.

However ,delimiter approach looks unstable.
For instance ; could be met inside objects attribute and split(';') operation will be uncorrect.

It could be used ;; for delimiter,but i'm not certain it will be stable also.

Is there any robust way to handle localStorage presented as array of objects,as far localStorage saved as String?

EDIT

one of stoppers is that array of object couldn't be saved to localStorage as classical: "[{},{}]"
localStorage converts it automatially to String like "{},{}"

my current data within localStorage:

"{"name":"volvo","id":"033"};{"name":"saab","id":"034"}"

assumption
perhaps,i can add [ at the start and ] at the end,but it looks not gracefull

回答1:

Just convert the objects to JSON strings:

localStorage.setItem("savedData", JSON.stringify(objects));

And vice versa:

objects = JSON.parse(localStorage.getItem("savedData")));

Or you can add multiple objects in the same localStorage value:

localStorage.setItem("savedData", JSON.stringify([object1, object2 /*, etc*/]));
object1 = JSON.parse(localStorage.getItem("savedData"))[0];
object2 = JSON.parse(localStorage.getItem("savedData"))[1];

Here's the DOM storage specification.

You can also access savedData like this:

localStorage.savedData = "Hello world"
var foo = localStorage.savedData;

This can be used for both getting and setting the data, but it is considered less "safe" than getItem('name'); and setItem('name', 'value');



回答2:

Read variables:

var xyz = JSON.parse( localStorage.getItem( 'element' ) );

Store variables:

localStorage.setItem( 'element' , JSON.stringify(xyz));

where element is the name of the local storage variable and xyz the name of the js variable.



回答3:

You can use parse and stringify if the array isn't too big, but if it is, then you'll be re-encoding the whole data set for every little change.

The library at http://rhaboo.org improves on that by giving each array entry its own localStorage entry in a linked list. That means you can make changes quite efficiently. Unlike JSON, it also honours text-named properties and three different types of sparse entry (null, undefined and simply not there.)

BTW, I wrote rhaboo.