References

Beginner-friendly references for web development, with live, editable examples.

The JavaScript sessionStorage object

Object JavaScript All modern browsers Updated
Quick answer

The sessionStorage object stores string key-value data that lasts only for the current tab session — it's cleared when the tab is closed. It shares the exact same API as localStorage (setItem, getItem, removeItem, clear); the only difference is lifespan.

Overview

sessionStorage is the short-lived twin of localStorage. It stores string key-value data in the browser, but only for the lifetime of the tab: close the tab and the data is gone. It's also scoped per tab, so two tabs of the same site each have their own separate sessionStorage — unlike localStorage, which is shared across all tabs of an origin.

The API is identical: sessionStorage.setItem(key, value), getItem(key) (returns null if absent), removeItem(key) and clear(). As with localStorage, everything is stored as strings, so objects need JSON.stringify() to save and JSON.parse() to read back.

The choice between them is purely about how long the data should live. Use sessionStorage for things that make sense only within a single visit — a multi-step form's progress, a temporary filter state, a "you were here" scroll position — and localStorage for preferences that should persist between visits. The same security caveat applies: any script on the page can read it, so never store tokens or secrets.

Syntax

sessionStorage.setItem("step", "2");   // tab-only
sessionStorage.getItem("step");        // "2" (or null)
sessionStorage.removeItem("step");
sessionStorage.clear();

// same string-only rule as localStorage
sessionStorage.setItem("form", JSON.stringify(data));

Example

Live example 
// keep multi-step form progress for this tab only
sessionStorage.setItem('step', '2');

const step = Number(sessionStorage.getItem('step')) || 1;
console.log('on step', step);

// store temporary state as JSON
sessionStorage.setItem('filters', JSON.stringify({ sort: 'price', open: true }));
const filters = JSON.parse(sessionStorage.getItem('filters'));

Best practices

  • Use sessionStorage for data that should only last the current visit/tab.
  • Use localStorage instead for preferences that persist between visits.
  • Serialize objects with JSON.stringify() — values are strings only.
  • Never store secrets — any script on the page can read it.

Frequently asked questions

What is the difference between sessionStorage and localStorage?
sessionStorage is cleared when the tab closes and is scoped per tab; localStorage persists until cleared and is shared across tabs. The API is identical.
When is sessionStorage cleared?
When the tab (or browser) is closed. Reloading the page keeps it; closing the tab wipes it.
How do I store an object in sessionStorage?
Serialize it: sessionStorage.setItem("k", JSON.stringify(obj)), then read with JSON.parse(sessionStorage.getItem("k")).
Is data shared between tabs?
No — each tab has its own sessionStorage. Use localStorage if you need data shared across tabs.
RegExp Set