How to use local storage for JavaScript – onlinecode

Local Storage is used to store data locally within user’s browser.

You can store large amount of data locally and it is more secure.

Question is when you will use local storage mechanism in your application?

Ok, suppose you are going to create a to-do application in JavaScript and pages are going reload then in that case all to-do’s are gone.

Local Storage resolve this issue to save your bits of data to user’s browser so that whenever you reload pages then data will still be there.

Local Storage is known as Web Storage and part of the HTML 5 specification.

There is no expiration date with data that is stored locally by using local storage.

It store data in key/value pairs.

Before HTML 5, you were using Cookie with limitations.

Cookie is basically a text file that allow data storage up to 4 KB.

You can set data in key and access data by key using local storage. Local Storage is similar to Session Storage.

Some of browser do not support local storage so first you have to check browser support for Local Storage.

if(typeof(Storage)!=="undefined"){
// Write code for local storage.
}else{
// Sorry, your browser does not support Web Storage..
}

if (typeof(Storage) !== "undefined") {
    // Write code for local storage.
} else {
    // Sorry, your browser does not support Web Storage..
}

Storing Objects in HTML5 localStorage

var demoObject ={'name':'xyz','email':'xyz@gmail.com'};
// save object into local storage with key 'demoObject'
localStorage.setItem('demoObject', JSON.stringify(demoObject));

var demoObject = { 'name': 'xyz', 'email': 'xyz@gmail.com'};

// save object into local storage with key 'demoObject'
localStorage.setItem('demoObject', JSON.stringify(demoObject));

Retrieve the object from storage

var getDemoObjectData = localStorage.getItem('demoObject');

var getDemoObjectData = localStorage.getItem('demoObject');

Remove the object from storage

localStorage.removeItem("demoObject");

localStorage.removeItem("demoObject");

Clear all keys out of the storage

localStorage.clear();

localStorage.clear();