Обратите внимание, что видимость данных в хранилище
<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><iframe></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", 1); // Сохранить число под именем "х" </b>
<b>localStorage.getltemC'x"); // Извлечь значение</b>
<b>// Перечислить все хранящиеся пары имя-значение</b>
<b>for(var і = 0; і < 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'); // Удалить элемент "х" </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.о.х // => 1: свойство х не изменилось</b>