Home Home How to Store Objects in HTML5 localStorage

How to Store Objects in HTML5 localStorage

HTML5 localStorage lets you store key/value pairs of data. Both key and value needs to be a string.

To store objects as a key or value you need to encode the object into a JSON string. And while retrieving you need to decode it back to an object.

Here is example code

var object = {
    x: 12,
    y: 56
}

localStorage.setItem("object", JSON.stringify(object));
object = JSON.parse(localStorage.getItem("object"));

console.log(typeof object); //object
console.log(object); //Object {x: 12, y: 56}
Narayan Prusty
Get HTML5 Audio Duration LengthHow to Store Arrays in HTML5 localStorage

Leave a Reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

Narayan Prusty

I am a full-stack web developer. I specialize in Blockchain and JavaScript. This is my personal blog where I write about programming and technologies that I learn and feel interesting to share.

3 years ago Web Development
Share this
Related Articles