本文是针对于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()对空字符串是会报错的