localStorage,sessionStorage的方法重写

本文是针对于localStorage,sessionStorage对于object,string,number,bollean类型的存取方法
我们知道,在布尔类型的值localStorage保存到本地的时候,true会保存为字符串类型的"true",而false会保存为字符串类型的"false",
而Object类型或者数组取出来会被转化为字符串,对象转化为 '[object,object]',因为存储的时候js会默认调取toString的方法,所以在调取时候需要进行类型转换。
(function(global,undefined){
   global.locMemory = {};
   global.locMemory.sessionStorage = {
       setItem:function(key,value,cb){
         value = value || '' ; 
         cb = cb || function(){};
         if(Array.isArray(value)){
             sessionStorage.setItem(`${key}`,`arrya_${JSON.stringify(value)}`);
         }
         if(typeof value === 'object'){
            sessionStorage.setItem(`${key}`,`object_${JSON.stringify(value)}`);
         }
         if(typeof value === 'string'){
            sessionStorage.setItem(`${key}`,`string_${value}`);
         }
         if(typeof value === 'boolean'){
            sessionStorage.setItem(`${key}`,`boolean_${value}`);
         }
         if(typeof value === 'number'){
            sessionStorage.setItem(`${key}`,`number_${value}`);
         }
         cb();
         return value;
       },
       getItem:function(key,cb){
            value = sessionStorage.getItem(key) || '' ;
            cb = cb || function(){}; 
            var type = value.split('_')[0];
            let res = value.match(/_([sS]*)/)[1];
            if(type === 'array' || type === 'object'){
              res =  JSON.parse(res);
            }
            if(type === 'boolean'){
              res = Boolean(res);
            }
            if(type === 'number'){
              res = Number(res);
            }
            cb(null,res);
            return res;
       },
       removeItem:function(key,cb){
            cb = cb || function(){};
            sessionStorage.removeItem(key);
            cb();
       },
       clear:function(cb){
         cb = cb || function(){};
         sessionStorage.clear();
         cb();
       }
   }
}(window))

这里在window对象中添加locMemory对象,在进行存的操作:

locMemory.sessionStorage.setItem('arr',[1,2,3]);
locMemory.sessionStorage.getItem('arr');
locMemory.sessionStorage.removeItem('arr');

locMemory.sessionStorage.clear();

这样在存取时候就不容易出现类型不对,进而报错的情况了。
其实无论是number,bollean,object,或者array,string类型,都是可以先对它进行对象序列化,JSON.stringify(),然后再进行JSON.parse()转回来即可。代码如下:

(function(global,undefined){
    global.locMemory = {};
    global.locMemory.sessionStorage = {
        setItem:function(key,value,cb){
          value = JSON.stringify(value);
          value = value || '' ;
          sessionStorage.setItem(`${key}`,`${value}`);          
          cb && cb();
          return value;
        },
        getItem:function(key,cb){
            value = sessionStorage.getItem(key) || '' ;
            value = value == '' ? '' : JSON.parse(value);
            cb && cb(null,value);
            return value;
        },
        removeItem:function(key,cb){
            sessionStorage.removeItem(key);
            cb && cb();
        },
        clear:function(cb){
          sessionStorage.clear();
          cb && cb();
        }
    }
 }(window))

需要注意的是:JSON.parse()对空字符串是会报错的
原文地址:https://www.cnblogs.com/tangjiao/p/8980070.html