前端持久化登录信息localstorage方法

localStorage用于持久化的存储；但是限时保存用户的登录信息，除了cookie和session，localStorage也可以做到；cookie字符长度有限制，并且不安全；session依赖后端；现在我要在前端保存用户信息，而不用每次后台判断或前端请求去判断；因为如果页面由前端输出，那么每次都得请求一次用户是否登录； 下面是github看到的一个方法库，我把源码分析一下。

先介绍一些基本语法，localStorage API介绍：

localStorage.setItem(key,value);//存储key值为value
localStorage.getItem(key)//获取key值
localStoage.key(i)//获取第i个key值
localStorage.removeItem(key)//删除key值对应的value
localStorage.clear()//清空localStorage所有的值
/*sessionStorage用法API相同*/

if(!window.localStorage) return;//不支持localStorage返回
var storage = window.localStorage,store,_api,even_storage=function(){};
function isJSON(obj){//通过typeof object.prototype.toString来判断obj是否是json形式，说白了就是判断是否有对象。
    return typeof(obj) === "object" && Object.prototype.toString.call(obj).toLowerCase() && !obj.length;
}
function stringify (val) {//JSON.stringfy()用来从一个json对象返回一个json形式字符串
    return val === undefined || typeof val === "function" ? val+'' : JSON.stringify(val);
}
function deserialize(value){//JSON.parse用来解析一个JSON形式的字符串，返回一个json形式对象
    if (typeof value !== 'string') { return undefined ;}
    try {
           return JSON.parse(value) ;
     }
    catch(e) {
         return value || undefined ;
    }
}
function isFunction(value) {//通过object.prototype.toString.call来判断是否是函数
       return ({}).toString.call(value) === "[object Function]";
 }
function isArray(value) {//通过instance来判断是否是数组，关于类型判断可以参考我前面的博客
       return value instanceof Array;
}

function Store(){//返回一个实例化对象
    if(!(this instanceof Store)){
        return new Store();
    }
}

Store.prototype = {
    set: function(key, val){//存储信息
        if (!val&&!key) { return this.remove(key) ;}
        even_storage('set',key,val);
        if(key&&val){
            storage.setItem(key, stringify(val));//存储
        }else if(key&&isJSON(key)&&!val){//JSON形式存储
            for (var a in key) this.set(a, key[a]);
        }
        return this;//方便链式操作
    },
    get: function(key){//获取key对应的值
        if(!key) {//如果key不存在就返回所有的key以及对应的value
            var ret = {};
            this.forEach(function(key, val) {
                ret[key] = val;
            });
            return ret;
        }
        return deserialize(storage.getItem(key));//返回一个json形式对象
    },
    clear: function(){
        this.forEach(function(key, val) {
            even_storage('clear',key,val);
        });
        storage.clear();//清空
        return this;
    },
    remove: function(key) {
        var val = this.get(key);
        storage.removeItem(key);//移除对应的
        even_storage('remove',key,val);
        return val;
    },
    has:function(key){
            return storage.hasOwnProperty(key);//判断storage是否有key这个属性
    },
    keys:function(){//返回所有key值数组
        var d=[];
        this.forEach(function(k, list){
            d.push(k);
        });
        return d;
    },
    size: function(){
         return this.keys().length;
    },//返回长度
    forEach: function(callback) {//遍历localstorage，让callback作用于
        for (var i=0; i<storage.length; i++) {
            var key = storage.key(i);
            if(callback(key, this.get(key))===false) break;
        }
        return this;
    },
    search: function(str) {//判断key值是否有对应str，如果有返回值
        var arr = this.keys(),dt= {};
        for (var i = 0; i < arr.length; i++) {
            if(arr[i].indexOf(str)>-1) dt[arr[i]]=this.get(arr[i]);
        }
        return dt;
    },
    onStorage: function(cb){
        if(cb && isFunction(cb)) even_storage = cb;
        return this;
    }
}

store = function(key, data){//根据传入参数形式，快捷访问
    var argm = arguments,
         _Store = Store(),
         dt = null;
    if(argm.length ===0) return _Store.get();
    if(argm.length ===1){
        if(typeof(key) === "string") return _Store.get(key);
        if(isJSON(key)) return _Store.set(key);
    }
    if(argm.length === 2 && typeof(key) === "string"){
        if(!data)return _Store.remove(key);
        if(data&&typeof(data) === "string")return _Store.set(key,data);
        if(data&&isFunction(data)) {
            dt = null
            dt = data(key,_Store.get(key))
            return dt?store.set(key, dt):store;
        }
    }
    if(argm.length === 2 && isArray(key) && isFunction(data)){
        for (var i = 0; i < key.length; i++) {
            dt = data(key[i],_Store.get(key[i]))
            store.set(key[i], dt)
        }
        return store
    }
}
for (var a in Store.prototype) store[a] = Store.prototype[a];
return store;