SessionStorage
ページのセッションがある間に有効なStorage
window.sessionStorage
は読み込み専用で、key-valueは setItem
, getItem
, removeItem
で操作する
jssessionStorage.setItem('key', 'value');
let item = sessionStorage.getItem('key');
sessionStorage.removeItem('key');
valueはstringなので、arrayやobjectを入れたい場合はJSON.stringifyするのが常套手段
値を更新するときはgetItemしてJSON.parseしてarrayやobjectにpushするなりなんなりしてJSON.stringifyしたやつをsetItem
例えばこう
jssessionStorage.setItem('key', JSON.stringify([...JSON.parse(sessionStorage.getItem('key'), value]);
getItemした値が無い可能性もあるので、もっと言えばこう
jssessionStorage.getItem('key') ? sessionStorage.setItem('key', JSON.stringify([...JSON.parse(sessionStorage.getItem('key'), value]) : sessionStorage.setIetm('key', JSON.stringify([value]);
値が変更された時には、
Web Storageのwindow.storageイベントが発火すると思ったのだが、しない?
> StorageEvent は、Storage オブジェクトが変更されるたびに発生します (sessionStorage の変更では発生しません) 。これは、変更を行ったページ上では効果がないでしょう。実際は、ストレージを使用するドメイン上の別のページで、ストレージの変更に同期するための手段です。