Ответ
Session Storage — это механизм клиентского хранилища, аналогичный Local Storage, но с ключевым отличием в времени жизни данных.
Основное отличие:
Данные в sessionStorage сохраняются только в течение сессии конкретной вкладки/окна браузера. При закрытии вкладки данные безвозвратно удаляются.
| Сравнительная таблица: | Характеристика | Session Storage | Local Storage |
|---|---|---|---|
| Время жизни | Данные живут в рамках сессии вкладки браузера. | Данные сохраняются до явного удаления. | |
| Объем | ~5 МБ на домен. | ~5-10 МБ на домен. | |
| Область видимости | Изолирована для каждой вкладки/окна (даже с тем же URL). | Общая для всех вкладок и окон с одним происхождением (origin). | |
| API | Аналогичен (setItem, getItem, removeItem, clear). |
Аналогичен. | |
| Формат данных | Только строки. | Только строки. |
Пример использования Session Storage:
// Сохранение временных данных формы при переходе между шагами в одной вкладке
sessionStorage.setItem('multiStepFormData', JSON.stringify({
step1: { name: 'John' },
step2: { email: 'john@example.com' }
}));
// Получение данных на следующей странице/шаге
const formData = JSON.parse(sessionStorage.getItem('multiStepFormData'));
console.log(formData.step1.name); // 'John'
// Данные будут потеряны, если пользователь закроет вкладку.Типичные сценарии применения:
- Временное хранение данных многостраничной формы (wizard).
- Кэширование информации в рамках одной сессии для избежания повторных запросов.
- Сохранение состояния UI, которое должно сбрасываться при новом открытии приложения.
Ответ 18+ 🔞
А, ну это же про ту самую штуку, которая помнит всё, пока ты в одной вкладке сидишь! Session Storage, блядь! Представь себе: ты как будто на кухне оставляешь записку на холодильнике, а потом закрываешь дверь нахуй — и всё, записка испарилась. Вот это оно и есть.
В чём соль, а? Это как Local Storage, его брат-близнец, но с одним ёбушки-воробушки отличием — данные живут, пока вкладка не захлопнулась. Закрыл таб — и пиздец, всё пропало, будто и не было. Никаких следов, как после хорошей пьянки.
Смотри, как они отличаются, эти два ублюдка:
| Признак | Session Storage | Local Storage |
|---|---|---|
| Сколько живут данные | Пока вкладка открыта. Закрыл — в рот меня чих-пых, всё! | До тех пор, пока ты их вручную не сотрёшь или браузер не снесёт. Живут, как тараканы. |
| Сколько можно нахранить | Примерно 5 МБ на один сайт. | Тоже около 5-10 МБ, зависит от браузера. |
| Кто видит эти данные | Только одна конкретная вкладка. Откроешь новую — там уже пусто, нихуя. | Все вкладки и окна, которые на этот же сайт зашли. Общедоступное говно. |
| Как с ними работать | Одинаково, те же самые команды: положить, достать, удалить. | Точно так же, один в один. |
| Что можно хранить | Только текст, блядь. Объекты и массивы — только если в строку превратить. | Опять же, только строки. Никаких тебе картинок напрямую. |
Вот тебе живой пример, как этим пользоваться:
// Допустим, ты заполняешь многостраничную форму, а потом тебя перекидывает на другую страницу.
// Чтобы не потерять введённое, пихаем всё в sessionStorage.
sessionStorage.setItem('multiStepFormData', JSON.stringify({
step1: { name: 'Василий' },
step2: { email: 'vasya@example.com' }
}));
// Потом, на следующем шаге, достаём это добро обратно.
const formData = JSON.parse(sessionStorage.getItem('multiStepFormData'));
console.log(formData.step1.name); // Выведет 'Василий'
// И помни: закроешь вкладку — и всё, твой Василий нахуй сгинет.А где это, блядь, пригождается в жизни?
- Когда ты проходишь какую-нибудь многошаговую хуйню типа оформления заказа, и нужно временно держать данные, пока ты по шагам прыгаешь.
- Чтобы лишний раз не дергать сервер в рамках одной сессии — закэшировал ответ и пользуешься, пока вкладка жива.
- Сохранить состояние интерфейса (например, раскрытые менюшки), которое должно сброситься, как только пользователь заново откроет приложение.