JavaScript. Подробное руководство, 6-е издание, стр. 333

Обратите внимание, что видимость данных в хранилище

<b>localStorage</b>
также ограничивается конкретным броузером. Если посетить сайт с помощью Firefox, а затем вновь посетить его, например, с помощью Chrome, никакие данные, сохраненные при первом посещении, не будут доступны при втором посещении.

Данные, сохраняемые в

<b>sessionStorage</b>
, имеют другой срок хранения: они хранятся, пока остается открытым окно верхнего уровня или вкладка броузера, в которой выполнялся сценарий, сохранивший эти данные. При закрытии окна или вкладки все данные, хранящиеся в
<b>sessionStorage</b>
, удаляются. (Отметьте, однако, что современные броузеры имеют возможность повторно открывать недавно закрытые вкладки и восстанавливать последний сеанс работы с броузером, поэтому срок хранения информации об этих вкладках и связанных с ними хранилищах
<b>sessionStorage</b>
может оказаться больше, чем кажется.)

Доступность данных в хранилище

<b>sessionStorage</b>
, как и в хранилище
<b>localStorage</b>
, ограничивается происхождением документа, т. е. документы с разным происхождением никогда не смогут совместно использовать одни и те же данные в
<b>sessionStorage</b>
. Но помимо этого доступность данных в хранилище
<b>sessionStorage</b>
ограничивается также окном. Если пользователь откроет в броузере две вкладки, отображающие документы с общим происхождением, эти две вкладки будут владеть разными хранилищами
<b>sessionStorage</b>
. Сценарий, выполняющийся в одной вкладке, не сможет прочитать или изменить данные, сохраненные в другой вкладке, даже если в обеих вкладках будет открыта одна и та же страница и будет выполняться один и тот же сценарий. Обратите внимание, что разграничение хранилищ
<b>sessionStorage</b>
в разных окнах касается только окон верхнего уровня. Если в одной вкладке броузера будет находиться несколько элементов
<b>&lt;iframe&gt;</b>
и в этих фреймах будут отображаться документы с общим происхождением, они будут совместно использовать одно и то же хранилище
<b>sessionStorage</b>
.

20.1.2. Прикладной программный интерфейс объекта Storage

Объекты

<b>localStorage</b>
и
<b>sessionStorage</b>
часто используются как обычные объекты языка JavaScript: присваивание значения свойству приводит к сохранению строки, а чтение свойства - к ее извлечению из хранилища. Но эти объекты определяют также более формальный прикладной интерфейс, основанный на методах. Сохранить значение можно с помощью метода
<b>setltem(),</b>
передав ему имя и значение. Извлечь значение можно с помощью метода
<b>getltem(),</b>
передав ему имя. Удалить значение можно с помощью метода
<b>removeItem(),</b>
передав ему имя. (В большинстве броузеров удалить значение можно также с помощью оператора
<b>delete</b>
, как если бы оно было обычным объектом, но этот прием не работает в IE8.) Удалить все хранящиеся значения можно вызовом метода
<b>сlеаг()</b>
(без аргументов). Наконец, перечислить имена всех хранящихся значений можно с помощью свойства
<b>length</b>
и метода
<b>кеу(),</b>
передавая ему значения от 0 до
<b>length</b>
-1. Ниже приводится несколько примеров использования объекта
<b>localStorage</b>
. Этот программный код с тем же успехом мог бы использовать объект
<b>sessionStorage</b>
:

<b>localStorage.setltem(”x&quot;, 1); // Сохранить число под именем &quot;х&quot; </b>

<b>localStorage.getltemC'x&quot;);    // Извлечь значение</b>

<b>// Перечислить все хранящиеся пары имя-значение</b>

<b>for(var і = 0; і &lt; localStorage.length; i++) { // length дает количество пар </b>

<b>  var name = localStorage.key(i);         // Получить имя і-й пары</b>

<b>  var value = localStorage.getltem(name); // Получить значение этой пары</b>

<b>}</b>

<b>localStorage.removeltemC'x'); // Удалить элемент &quot;х&quot; </b>

<b>localStorage.clear();         // Удалить все остальные элементы</b>

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

<b>clear()</b>
не имеет эквивалента и является единственным способом удаления всех пар имя/значение в объекте
<b>Storage</b>
. Аналогично метод
<b>removeltem()</b>
является единственным переносимым способом удаления одной пары имя/значение, потому что IE8 не позволяет использовать оператор
<b>delete</b>
для этой цели.

Если производители броузеров реализуют все положения спецификации и позволят сохранять в объекте

<b>Storage</b>
другие объекты и массивы, появится еще одна причина использовать методы, такие как
<b>setltem()</b>
и
<b>getltem().</b>
Объекты и массивы являются изменяемыми значениями, поэтому объекту Storage необходимо будет создавать копию сохраняемого значения, чтобы все последующие изменения в оригинале не коснулись хранящегося значения. Точно так же объект
<b>Storage</b>
должен будет создавать копию и при извлечении значения, чтобы никакие изменения в извлеченном значении не коснулись хранящегося значения. Когда такое копирование будет реализовано, использование интерфейса свойств может показаться запутывающим. Взгляните на следующий (гипотетический, пока броузеры не поддерживают возможность сохранения структурированных значений) фрагмент:

<b>localStorage.о = {х:1}; // Сохранить объект, имеющий свойство х </b>

<b>localStorage.о.х =2; // Попытка установить свойство хранящегося объекта</b>

<b>localStorage.о.х // =&gt; 1: свойство х не изменилось</b>