Что представляет собой localStorage и как его используют в браузере
Краткий ответ
localStorage — это браузерное хранилище данных в формате ключ-значение, которое сохраняет информацию на стороне клиента без срока действия. Данные остаются доступными даже после закрытия или перезагрузки браузера.
Развёрнуто
Краткий ответ
localStorage — это встроенный механизм браузера для долговременного хранения данных в формате пар ключ-значение. Он обеспечивает сохранение информации на клиентской стороне без автоматического удаления.
Как это работает
localStorage предоставляет объект window.localStorage, который позволяет сохранять и получать данные в браузере. В отличие от sessionStorage, данные в localStorage не удаляются при закрытии вкладки или браузера, что делает его удобным для сохранения настроек пользователя, тем и других постоянных данных.
Данные хранятся в виде строк, и ключи, и значения должны быть строками. При работе с localStorage важно помнить, что размер хранилища ограничен (обычно около 5 МБ).
| Параметр | Описание |
|---|---|
| Объект | window.localStorage |
| Формат хранения | Строки (ключ-значение) |
| Время хранения | Без срока действия, сохраняется постоянно |
| Максимальный размер | Обычно 5 МБ |
Пример
// Сохранение данных
localStorage.setItem('theme', 'dark');
// Получение данных
const theme = localStorage.getItem('theme');
console.log(theme); // Выведет 'dark'
// Удаление данных
localStorage.removeItem('theme');
// Очистка всего localStorage
localStorage.clear();
В этом примере сохраняется тема оформления, которая остается доступной при повторных загрузках страницы.
Что важно знать на собеседовании
- localStorage хранит данные в виде пар ключ-значение в браузере на стороне клиента.
- Данные сохраняются без срока действия и не удаляются при закрытии вкладки или браузера.
- Размер хранилища ограничен, обычно около 5 МБ.
- Все данные хранятся в виде строк, поэтому при необходимости нужно преобразовывать объекты в JSON.
- localStorage работает синхронно и может влиять на производительность при больших объёмах данных.
Тема: Web-тестирование и DevTools | Уровень: junior