58 lines
3.2 KiB
Markdown
58 lines
3.2 KiB
Markdown
---
|
||
title: Window.localStorage
|
||
localeTitle: Window.localStorage
|
||
---
|
||
## window.localStorage
|
||
|
||
`localStorage` предоставляет возможность для ваших веб-приложений хранить данные локально в браузере пользователя.
|
||
|
||
До HTML5 данные приложения должны храниться в файлах cookie. Куки-файлы включены в каждый HTTP-запрос, тем самым замедляя ваше веб-приложение, передавая одни и те же данные. Файлы cookie также ограничены примерно 4 КБ данных, которые могут быть недостаточными для хранения требуемых данных.
|
||
|
||
Предел `localStorage` больше, чем у файлов cookie с до 10 МБ данных на домен, и информация никогда не передается серверу.
|
||
|
||
### Типы localStorage
|
||
|
||
Существует два основных типа сетевых хранилищ:
|
||
|
||
* Локальное хранилище: хранит данные без истечения срока действия. Данные в `localStorage` будут сохраняться, даже если браузер пользователя будет закрыт и снова открыт.
|
||
* `localStorage` сеансов: это похоже на `localStorage` , за исключением того, что оно хранит данные только для одного сеанса. Когда пользователь закрыт браузером, этот сеанс будет потерян, а сохраненные данные будут удалены из браузера.
|
||
|
||
### Методы локального хранилища HTML5
|
||
|
||
`localStorage` поставляется с несколькими различными методами JavaScript, из-за которых очень легко работать, давайте посмотрим на некоторые:
|
||
|
||
_Примечание. Эти методы применяются как к типам веб-хранилища (локальное хранилище и хранилище сеансов)_
|
||
|
||
Чтобы установить данные, нам необходимо сделать следующее:
|
||
|
||
```javascript
|
||
localStorage.setItem('Name', 'somevalue');
|
||
```
|
||
|
||
Чтобы получить некоторые данные из хранилища:
|
||
|
||
```javascript
|
||
localStorage.getItem('Name');
|
||
```
|
||
|
||
Для удаления или удаления некоторых данных мы можем сделать это:
|
||
|
||
```javascript
|
||
localStorage.removeItem('Name');
|
||
```
|
||
|
||
Чтобы очистить все хранилище (а не только отдельный элемент), мы можем использовать:
|
||
|
||
```javascript
|
||
localStorage.clear();
|
||
```
|
||
|
||
Чтобы получить количество свойств в хранилище:
|
||
|
||
```javascript
|
||
localStorage.length;
|
||
```
|
||
|
||
#### Дополнительная информация:
|
||
|
||
[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) |