Как использовать localStorage в JavaScript

Как использовать localStorage в JavaScript

Механизм localStorage предоставляет тип объекта веб-хранилища, который позволяет хранить и извлекать данные в браузере. Вы можете хранить и получать доступ к данным без истечения срока действия; данные будут доступны даже после того, как посетитель закроет ваш сайт.





Обычно вы получаете доступ к localStorage с помощью JavaScript. С помощью небольшого количества кода вы можете создать пример проекта, например, счетчик очков. Это покажет, как вы можете хранить и получать доступ к постоянным данным, используя только код на стороне клиента.



Что такое localStorage в JavaScript?

Объект localStorage является частью API веб-хранилища, поддерживаемого большинством веб-браузеров. Вы можете хранить данные в виде пар ключ-значение, используя localStorage. Уникальные ключи и значения должны быть в формате строки DOM UTF-16.





Если вы хотите хранить объекты или массивы, вам придется преобразовать их в строки с помощью JSON.stringify() метод. Вы можете хранить до 5 МБ данных в localStorage. Кроме того, все окна с одним и тем же источником могут совместно использовать данные localStorage этого сайта.

Браузер не удалит эти данные, даже если пользователь его закроет. Он будет доступен для создавшего его веб-сайта во время любой будущей сессии. Однако не следует использовать localStorage для конфиденциальных данных, поскольку другие сценарии, работающие на той же странице, могут получить к ним доступ.



localStorage против sessionStorage

локальное хранилище и хранилище сессий объекты являются частью API веб-хранилища, в котором пары ключ-значение хранятся локально. Все современные браузеры поддерживают их оба. С localStorage срок хранения данных не истекает даже после того, как пользователь закроет свой браузер. Это отличается от sessionStorage, который очищает данные после завершения сеанса страницы. Сеанс страницы заканчивается, когда вы закрываете вкладку или окно.