💾 LocalStorage and SessionStorage in JavaScript

Both LocalStorage and SessionStorage allow you to store key/value pairs in the browser. The difference lies in how long the data persists.

📦 LocalStorage

Data in localStorage persists even after the browser is closed. It has no expiration time.

// Store data
localStorage.setItem("username", "John");

// Retrieve data
const user = localStorage.getItem("username");
console.log(user); // John

// Remove a key
localStorage.removeItem("username");

// Clear all
localStorage.clear();

🕒 SessionStorage

Data in sessionStorage is cleared when the page session ends (usually when the tab or window is closed).

// Store session data
sessionStorage.setItem("theme", "dark");

// Retrieve data
console.log(sessionStorage.getItem("theme")); // dark

// Remove data
sessionStorage.removeItem("theme");

// Clear session
sessionStorage.clear();

🛠 Use Cases

• LocalStorage: Save user preferences, theme settings, app state.
• SessionStorage: Temporary form data, session-based login flags.

📝 Storing Objects

You must stringify objects before storing them.

const user = { name: "Alice", age: 25 };
localStorage.setItem("user", JSON.stringify(user));

// Later...
const data = JSON.parse(localStorage.getItem("user"));
console.log(data.name); // Alice

✅ Summary

• localStorage = persistent storage (stays until removed).
• sessionStorage = temporary storage (clears on tab close).
• Use JSON.stringify and JSON.parse for storing/retrieving objects.