複数データの読み出し

複数データをオブジェクトにまとめて保存した場合
まとめてデータを読み出します

以下はソース
var load_str ~ localStorage.playerData;

//読み出したデータをオブジェクトに変換
var load_obj = JSON.parse(load_str);

//オブジェクトを変数に代入
var name = load_obj.name;
var hp = load_obj.hp;
var dress = load_obj.dress;



JSON.stringy() でJSON文字列にして保存した
データを
JavaScriptオブジェクトに復元するには
JSON.parse() を津かいます

JSON文字列では、
数値や文字列などの型情報は保存されているため
parseInt()
parsefloat()
などで数値変換しなくても大丈夫です

さらに、複数の値を localStorage の
１つのキーにまとめて保存することもできます
また、逆に複数のキーにわけて保存することもできます

ちなみに、このJSON.parse() ですが
Web API でマッシュアップするときにも使えます

最近ではXML以外に JSON で提供もされていますので
いろいろ使うことができます

また、JSONを使うことで
ゲームの保存と読み込み、
セーブとロードができるので、いろいろと活用すると
おもしろいゲームができそうです

Web Storage の活用

Web Storage はブラウザ側
つまりスマホ端末内に
任意のデータを保存する技術

これがない従来のweb アプリでは
データの保存には
webサーバーに保存する
もしくは
Cookie に保存していました

ちなみに、Cookie のh存容量は
4kB未満ですが

Web Storage では
2.4MBほどあります

Web Storage API は
キーと値のペアでデータを保存する
キーバーリュー型で実装されています

Web Storage には２種類あり、
データを永続化するlocalStorage

ブラウザを閉じるまで有効な
sessionStorage

この２つになります

この２つは用途により使い分けします

あと、これらはオリジンごとに保存されます

オリジンは、
プロトコル＋ドメイン＋ポート番号
のことです

Web Storage の基本的な書式は

ストレージへ値を保存するには
localStorage[key]= value;

ストレージからの読み出しは
var value = localStorage[key];

となります