LocalStorageを使用すると便利です。 さて、同時にSessionStorageで

ローカルストレージとセッションストレージを便利に使用するためのライブラリをご紹介します。 プロジェクトでの作業の副産物として登場し、かなり便利な機能がいくつか含まれています。 ライブラリは、すべての最新のブラウザをサポートしています。

• Internet Explorer 8以降
• Mozilla Firefox 3.5以降
• Google Chrome 4+
• Safari 4+
• Opera 10.5+

伝統的なもの-set / get / inc / decに加えて、便利な「グッズ」のセットがあります：

• incは文字列で動作します
• オブジェクトの拡張
• 配列を操作するための多くの方法
  
  • 通常の追加/付加/ takeLast / takeFirst / getLast / getFirst
  • 一意性チェック付き-.appendUnique / .prependUnique
  • すべての追加/追加メソッドに制限を渡すことができます-MRUリストを整理するのに便利です
• チェーンを呼び出します-私は彼に喜んでいます:)

興味があるなら-私は例のために猫を求めます。 ライブラリの機能を非常によく示しているように思えます。

br.storage.get('foo', 'bar'); // bar br.storage.set('foo', 'bar2').get('foo'); // bar2 br.storage.set('boolean', true).get('boolean'); // true br.storage.set('integer', 666).get('integer'); // 666 br.storage.set('val', 10).inc('val', 5).inc('val').get('val'); // 16 br.storage.set('val', 10).dec('val', 5).dec('val').get('val'); // 4 br.storage.set('colors', 'red').inc('colors', 'white').inc('colors', 'blue').get('colors'); // red, white, blue br.storage.set('tags', 'storage').inc('tags', 'html5', ' ').inc('tags', 'local', ' ').get('tags'); // storage html5 local br.storage.clear().set('one', 1).set('two', 2).set('three', 3).get(['one', 'two', 'three']); // { one: 1, two: 2, three: 3 } br.storage.set('array', [1, 2, 3, 4, 5]).get('array'); // [1, 2, 3, 4, 5] br.storage.set({prop1: 'val1', prop2: 'val2' }).get('prop2'); // val2 br.storage.remove('prop1').get('prop2'); // val2 br.storage.set({prop1: 'val1', prop2: 'val2' }).get(['prop1', 'prop2']); // { prop1: "val1", prop2: "val2" } br.storage.remove(['prop1', 'prop2']).get('prop1'); // null br.storage.set('object', { prop1: 'one', prop2: 'two' }).get('object'); // { prop1: "one", prop2: "two" } br.storage.set('delicious', true).get('delicious'); // true br.storage.not('delicious').get('delicious'); // false br.storage.set('array', [1, 2, 3]).append('array', 4).get('array'); // [1, 2, 3, 4] br.storage.set('array', [1, 2, 3]).prepend('array', 4).get('array'); // [4, 1, 2, 3] br.storage.set('array', [1, 2, 3]).takeLast('array'); // 3 br.storage.get('array'); // [1, 2] br.storage.set('array', [1, 2, 3]).takeFirst('array'); // 1 br.storage.get('array'); // [2, 3] br.storage.set('array', [1, 2, 3]).getLast('array'); // 3 br.storage.get('array'); // [1, 2, 3] br.storage.set('array', [1, 2, 3]).getFirst('array'); // 1 br.storage.get('array'); // [1, 2, 3] br.storage.set('object', { prop1: 'one' }).extend('object', { prop2: 'two' }).get('object'); // { prop1: "one", prop2: "two" } br.storage.set('object', { prop1: 'one' }).extend('object', { prop2: 'two', prop3: 'three' }).get('object'); // { prop1: "one", prop2: "two", prop3: "three" } br.storage.set('array', [1, 2, 3]).each('array', function(value) { console.log(value); }); // 1 // 2 // 3 br.storage.set('array', [1, 2, 3]).appendUnique('array', 1).appendUnique('array', 4).get('array'); // [2, 3, 1, 4] br.storage.set('array', [1, 2, 3]).prependUnique('array', 1).prependUnique('array', 4).get('array'); // [4, 1, 2, 3] br.storage.set('array', [1, 2, 3]).append('array', 4, 3).get('array'); // [2, 3, 4] br.storage.set('array', [1, 2, 3]).prepend('array', 4, 3).get('array'); // [4, 1, 2] br.storage.all(); // { array: [2, 3] // , boolean: true // , colors: "red, white, blue" // , delicious: false // , foo: "bar2" // , integer: 666 // , object: { prop1: "one", prop2: "two", prop3: "three" } // , one: 1 // , tags: "storage html5 local" // , three: 3 // , two: 2 // } 

br.sessionを介したsessionStorageでも同じことが機能します。

ライブラリhttps://github.com/jagermesh/breezeをダウンロードできます。 批判は大歓迎です:)