Skip to content

Latest commit

 

History

History
97 lines (83 loc) · 3.25 KB

File metadata and controls

97 lines (83 loc) · 3.25 KB

xStorage.js

xStorage.js online

Features

  • Supporting data types in Web storage. : array, object, string, number
  • Shorthand function. : create, update, remove in one function
  • Stability with other codes to use same web storage. : prefix
  • Practical uses for object and array type values

Shorthand function

// 1. Save data
xStorage("address", {city: "seoul", country: "ko"});
// 2. Load data
var language = xStorage('language');
// 3. remove data
xStorage('currency', '');

Practical cases

Creating Bookmarkstorage

Don't need to load or to save again. Added/updated/modified/created/destroyed/removed, it's saved automatically.

var bookmarkStorage = xStorage.create("bookmark",[]);
bookmarkStorage.add({name:'google', url:'https://www.google.com'});
bookmarkStorage.add({name:'msn', url:'http://www.msn.com'});
bookmarkStorage.add({name:'naver', url:'https://www.naver.com'});
var firstBookmark = bookmarkStorage(0);
var bookmarkData = bookmarkStorage.data;

modifying Bookmark

var bookmarkStorage = xStorage.local.bookmark;
bookmarkStorage(2, {name:'yahoo', url:'https://www.yahoo.com'});
bookmarkStorage.remove(1);
var firstBookmark = bookmarkStorage(0);

user info

var userinfo = xStorage.create("userinfo",{});
userinfo('language', 'en');
userinfo('phone', '010-3452-1392');
userinfo('country', 'ko');
userinfo('phone', ''); // delete phone
userinfo('country'); // return 'ko';

xStorage API : Global

  • xStorage(name, value, type); // type : local | session
  • xStorage.save(name, value, type); // = xStorage(name, value, type)
  • xStorage.load(name, type); // = xStorage(name, type)
  • xStorage.remove(name, type); // = xStorage(name, '')
  • xStorage.clear(type); // clear storage, type : local | session
  • xStorage.open(name, type, data); // if it's not exist, create new one;
  • xStorage.create(name, initValue, type); // initValue : [] | {}
  • xStorage.local; // local Storage collection
  • xStorage.session; // session Storage collection

xStorage API : Inner function object

  • _StorageItem(keyOrIndex, value); // type : local | session
  • _StorageItem.data;
  • _StorageItem.title;
  • _StorageItem.type; // local | session
  • _StorageItem.add(); // only array type
  • _StorageItem.remove(keyOrIndex);
  • _StorageItem.destroy();
  • _StorageItem.save();
  • _StorageItem.valueOf(); // == _StorageItem._data.valueOf();
  • _StorageItem.toString(); // == _StorageItem._data.toString();

MISC

Shorthand function without using types.

var storage = function(name, value) {
  if (value === '') return localStorage.removeItem(name);
  else if (value) return localStorage.setItem(name, value) && this;
  else if (name) return localStorage.getItem(name);
}

Extras

UPDATES

  • 2017-03-21
    • added open method, fix bug (wrong methond name)
  • 2017-03-17
    • fix variable names.

IE8 pollyfill

If you want to use this on IE8, you need four pollyfills.

JSON, Object.keys, Array.isArray(), Array.prototype.forEach