Хочу представить вашему вниманию библиотеку для удобной работы с Local и Session Storage. Она появилась, как побочный продукт работы над проектом и содержит несколько довольно удобных функций. Библиотека поддерживает все современные браузеры, а именно:
- Internet Explorer 8+
- Mozilla Firefox 3.5+
- Google Chrome 4+
- Safari 4+
- Opera 10.5+
Помимо традиционных — set/get/inc/dec, есть набор удобных «вкусностей»:
- inc работает со строками
- extend для объектов
- много методов для работы с массивами
- обычные append/prepend/takeLast/takeFirst/getLast/getFirst
- с проверкой уникальности — .appendUnique/.prependUnique
- во все append/prepend методы можно передавать лимит — удобно для организации MRU списков
- calls chaining — я от него в восторге :)
Если заинтересовал — прошу под кат за примерами. Мне кажется они достаточно хорошо показывают возможности библиотеки.
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) { 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
// }
Все тоже самое работает и для sessionStorage через br.session.
Скачать библиотеку можно https://github.com/jagermesh/breeze. Критика приветствуется :)
Автор: jagermesh