JavaScript sessionStorage

sessionStorage is an object in JavaScript that provides a way to store key-value pairs in the browser’s session storage. It allows you to store data that persists within a specific browsing session and is accessible across different pages or reloads within the same session.

The data stored in sessionStorage is specific to the current browser tab or window. When the tab or window is closed or the session is ended, the data in sessionStorage is cleared.

Here are some basic operations you can perform with sessionStorage:

1. Storing data:

sessionStorage.setItem('key', 'value');

2. Retrieving data:

const value = sessionStorage.getItem('key');

3. Updating data:

sessionStorage.setItem('key', 'new value');

4. Removing data:

sessionStorage.removeItem('key');

5. Clearing all data:

sessionStorage.clear();

The data stored in sessionStorage is limited to string values. If you want to store complex objects or non-string values, you can use JSON.stringify() to convert the data to a string before storing it and JSON.parse() to convert it back to its original format when retrieving it.

Here’s an example that demonstrates the usage of sessionStorage:

// Storing data
sessionStorage.setItem('username', 'John');
sessionStorage.setItem('loggedIn', 'true');

// Retrieving data
const username = sessionStorage.getItem('username');
const loggedIn = sessionStorage.getItem('loggedIn');

console.log(username); // Output: "John"
console.log(loggedIn); // Output: "true"

// Updating data
sessionStorage.setItem('loggedIn', 'false');

// Removing data
sessionStorage.removeItem('username');

// Clearing all data
sessionStorage.clear();

Note that sessionStorage is limited to the current browser tab or window. If you need to store data that persists across different sessions or browser instances, you can use the localStorage object instead.