В чём отличие localStorage и sessionStorage?

// localStorage — навсегда
localStorage.setItem('name', 'Иван');
// Даже после перезагрузки страницы и закрытия браузера
// данные останутся
 
// sessionStorage — до закрытия вкладки
sessionStorage.setItem('temp', 'временные данные');
// После закрытия вкладки данные исчезнут

// Сохраняем данные
localStorage.setItem('theme', 'dark');
localStorage.setItem('language', 'ru');
 
// Можно закрыть браузер, перезагрузить компьютер
// Данные всё равно будут здесь!
console.log(localStorage.getItem('theme')); // 'dark'

// Сохраняем временные данные
sessionStorage.setItem('formStep', '2');
sessionStorage.setItem('tempData', 'что-то временное');
 
// После закрытия вкладки — всё исчезает!
// При открытии новой вкладки — хранилище пустое

// ✅ Настройки пользователя
localStorage.setItem('theme', 'dark');
localStorage.setItem('language', 'ru');
 
// ✅ Токены авторизации (осторожно!)
localStorage.setItem('token', 'abc123');
 
// ✅ Прогресс в играх
localStorage.setItem('level', '5');

// ✅ Данные формы во время заполнения
sessionStorage.setItem('formData', JSON.stringify({name: 'Иван'}));
 
// ✅ Временные состояния страницы
sessionStorage.setItem('scrollPosition', '100');
 
// ✅ Данные для одной сессии
sessionStorage.setItem('visitCount', '3');

// Оба работают одинаково
localStorage.setItem('key', 'value');
sessionStorage.setItem('key', 'value');
 
localStorage.getItem('key');
sessionStorage.getItem('key');
 
localStorage.removeItem('key');
sessionStorage.removeItem('key');

// Оба хранят только строки!
localStorage.setItem('number', 42); // Сохранится как '42'
localStorage.setItem('object', {name: 'Иван'}); // Сохранится как '[object Object]'
 
// Для объектов используй JSON
localStorage.setItem('user', JSON.stringify({name: 'Иван'}));
const user = JSON.parse(localStorage.getItem('user'));

// ❌ Ошибка — думают, что sessionStorage тоже навсегда
sessionStorage.setItem('importantSetting', 'dark');
// После закрытия вкладки настройка исчезнет!
 
// ✅ Правильно — использовать localStorage для важного
localStorage.setItem('importantSetting', 'dark');

// ❌ Плохо — localStorage можно легко прочитать
localStorage.setItem('password', '123456');
 
// ✅ Лучше — использовать безопасные методы
// или хотя бы sessionStorage (меньше шансов утечки)
sessionStorage.setItem('token', 'abc123');