JavaScript Web Storage

Web storage is the feature that introduces with html5 and As we know we store application data inside cookies, which include a lot of server requests. But after web storage, we have a more secure and elegant way to store data, providing a large amount of space to store data with excellent performance. Here we have at least a 5MB limit to store data locally.

Web storage is a way by which an application can store data locally inside a web browser. It’s used per origin. All pages can keep the same amount of data.

In this API we have two main objects –

• window.sessionStorage data stored for one session means when we close the tab data will be lost
• window.localStorage data store without expiration date

// Check browser support

if ( typeof(Storage) != "undefined" ) {
	// works
} else {
	// Not supported by the browser
}

localStorage.setItem(key, value); //set stroage
localStorage.getItem(key); // get stroage
localStorage.removeItem(key); // remove key from stroage
localStorage.clear(); // clear all stroage
localStorage.key(index); // get stroage according to index

Here you can see the localStorage related method but sessionStorage Objects have the same method.

All values are stored inside Storage as a string so be careful when using storage API.
how to use Storage –

localStorage.setItem("no", 1);
console.info(typeof localStorage.getItem("no")); // string

So if you want to convert this string value into no you need to use the parseInt method.

localStorage.setItem("no", 1);
console.info(typeof parseInt(localStorage.getItem("no"))); // number

For more details and useful examples, you can read this article – Local storage techniques