localStorage等问题

2018-09-28  本文已影响0人  __南墙

最近整理了下个人对localStorage的一些见解:

特点:

localStorage是浏览器永久缓存,除非主动删除,否则不会消失.

针对不同的浏览器localStorage的可缓存大小也不同.

一些方法

添加/更新

localStorage.setItem(key,val) //设置localStorage,此方法用来新增和跟新

需要注意的是 localStorage只支持缓存string类型的值,所以我们在添加一个对象或数组的时候也许要装换一下格式:

    localStorage.setItem(key,JSON.stringify)
    //或.toLocaleString(),不同之处日后详解.

获取

//获取指定的数据
localStorage.getItem(key);
//获取指定下标的值
localStorage.key(index);

删除

//删除指定数据.
localStorage.removeItem(key)
//清空localStorage所有数据
localStorage.clear()

查找

//用于查找是否存在指定的key值
返回值 true | false
localStorage.hasOwnProperty(key);
//查找所有的数据
localStorage.valueOf()

如果每次调用都要写上完整的方法,又恰好需要多次重复运用,不妨试试以下写法:

封装

var Storage = {
    set:(key,val)=> {
      return localStorage.setItem(key,JSON.stringify(val));
    },
    get:key => {
        return JSON.parse(localStorage.getItem(key))
    },
    add:(key,newVal) => {
        let oldData = Storage.get(key);
        let inewVal = oldData.concat(oldData);
        Storage.set(key,inewVal)
    },
    dele:key => {
       localStorage.removeItem(key)
    },
    has:key => {
        return localStorage.hasOwnProperty(key)
    },
    clear:()=>{
        localStorage.clear()
    },
    searchAll:() => {
        return localStorage.valueOf()
    }
}

以上就是一些简单的封装,具体使用还请选择适宜的应用场景.

上一篇 下一篇

猜你喜欢

热点阅读