Ответ
LocalStorage — это API веб-хранилища (Web Storage), который позволяет сохранять данные в браузере пользователя в формате «ключ-значение» без срока действия. Данные сохраняются между сессиями и перезагрузками браузера.
Основные отличия от sessionStorage:
- localStorage: данные не имеют срока годности, доступны в рамках одного источника (домена) даже после закрытия браузера.
- sessionStorage: данные очищаются после закрытия вкладки/окна браузера.
Базовые операции (JavaScript):
// Запись данных
localStorage.setItem('userToken', 'abc123xyz');
localStorage.setItem('theme', 'dark');
// Чтение данных
const token = localStorage.getItem('userToken'); // 'abc123xyz'
const theme = localStorage.getItem('theme'); // 'dark'
// Удаление конкретного элемента
localStorage.removeItem('theme');
// Полная очистка хранилища для текущего домена
localStorage.clear();
// Получение ключа по индексу
const keyName = localStorage.key(0); // 'userToken'Ключевые особенности и ограничения:
- Объём: обычно 5–10 МБ на домен (зависит от браузера).
- Доступ: только из JavaScript в контексте того же источника (Same-Origin Policy).
- Тип данных: хранит только строки. Для объектов используйте
JSON.stringify()при записи иJSON.parse()при чтении. - Синхронность: операции блокируют основной поток. Для больших данных это может повлиять на производительность.
- Безопасность: данные не защищены и доступны для любого скрипта на странице. Не храните чувствительную информацию (пароли, токены).
Ответ 18+ 🔞
Ну вот, опять про эту вашу хрень, про LocalStorage. Сидит такой фронтендер, блядь, и думает: "А куда бы мне на клиенте всякую хуйню запихнуть?" И тут он, сука, вспоминает про эту штуку. Это типа такой шкафчик в браузере, куда ты можешь сложить свои пыльные консервы с данными, и они там будут лежать, пока ты их не съешь или пока пользователь не почистит хранилище, блядь.
Главная фишка — положил и забыл. Закрыл браузер, вырубил комп, пришёл через год — а твои ключи-значения, блядь, на месте, как ни в чём не бывало. В отличие от его брата-близнеца, sessionStorage, который после закрытия вкладки накрывается медным тазом. Тот — как одноразовый стаканчик, а этот — как заначка в банке из-под варенья.
Как с этим чудом обращаться? Да элементарно, ёпта!
// Запихнул что-то в этот шкаф
localStorage.setItem('userToken', 'abc123xyz'); // Вот, положил токен, будто он тут в безопасности, ага, щас
localStorage.setItem('theme', 'dark'); // Тёмная тема, чтобы глаза не ебало по ночам
// Достал обратно, понюхал — не протухло ли
const token = localStorage.getItem('userToken'); // 'abc123xyz'
const theme = localStorage.getItem('theme'); // 'dark'
// Надоела тема — выкинул нахуй конкретно её
localStorage.removeItem('theme');
// Ощутил приступ чистоты — вымел всё подчистую
localStorage.clear();
// Тыкаешь пальцем в небо — "а что у меня там лежит под номером 0?"
const keyName = localStorage.key(0); // 'userToken'А теперь, блядь, держи в голове подводные грабли, об которые все ебут лбы:
- Сколько влезет? Ну, овердохуища не жди. Обычно 5-10 мегабайт на весь твой домен. Не библиотеку Льва Толстого туда пихать, в рот меня чих-пых!
- Кому доступно? Только твоим скриптам с той же страницы и того же домена. Чужие с соседнего сайта не залезут — политика одинарного происхождения, блядь, она такая.
- Что кладётся? Только строки, ёбана! Хочешь запихнуть объект или массив? Оберни в
JSON.stringify(), а то получишь свою любимую надпись[object Object]. Вынимать — соответственно,JSON.parse(), иначе будешь смотреть на строку как дурак. - А быстро? Да не очень, блядь. Операции синхронные, основной поток блокируют. Если ты туда гигабайт логов решишь сохранять — пользователь тебе спасибо не скажет, будет сидеть и ждать, пока твой говнокод отработает.
- А безопасно? Да хуй там, а не безопасно! Это же не сейф, а стеклянная витрина. Любой скрипт на твоей же странице может всё это прочитать. Пароли, платежные данные, интимные переписки — если такое туда сунешь, ты просто пидарас шерстяной. Токены — с большой осторожностью, и то только если очень надо и риски просчитаны.
Вот и весь сказ, блядь. Инструмент как инструмент. Иногда полезный, иногда — прямая дорога к ебаным костылям и багам, которые всплывут через полгода. Думай головой, что и зачем туда пихаешь.