你除了在客户端上会使用Cookie,还能使用哪些可以作为数据缓存呢?

问题如标题,直奔主题.介绍下另两种缓存.

1.sessionStorage、localStorage 

localStorage: 是一种你不主动清除它,它会一直将存储数据存储在客户端的存储方式,即使你关闭了客户端(浏览器),属于本地持久层储存 

sessionStorage: 用于本地存储一个会话(session)中的数据,一旦会话关闭,那么数据会消失,比如刷新。 

有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有:
1 缓存数据
2 减少对内存的占用
但是,storage只能存储字符串的数据,对于JS中常用的数组或对象却不能直接存储。
它能保存更大的数据(IE8上是10MB,Chrome是5MB),同时保存的数据不会再发送给服务器,避免带宽浪费。

localStorage存储方法(sessionStorage类似) 存取清方式如下:

:
localStorage.name =’vanida;
localStorage[“name”]=’vanida’;
localStorage.setItem(“name”,”vanida”);
//这三种设置值方式是一样的;

:
localStorage获取值方法
var name = localStorage[“name”]
var name= localStorage.name
var name= localStorage.getItem(“name”);
//这三种获取值方式是一样的;

:
localStorage清除特定值方法
//清除name的值
localStorage.removeItem(“name”);
localStorage.name=”;
localStorage清除所有值方法
localStorage.clear()

对象转json存储:
localStorage只能存储字符串,如果需要存储对象,首先要转化为字符串。利用JSON.stringify();
var person = {name:”vanida”,”sex”:”girl”,”age”:25};
localStorage.setItem(“person”,JSON.stringify(person));
// localStorage.person=”{“name”:”vanida”,”sex”:”girl”,”age”:25}”
然后取出person的对象你可以用JSON.parse();
person = JSON.parse(localStorage.getItem(“person”));
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

下面是我写的cache.js:对原始进行局部封装:

//获取cookie的值
function getCookieVale(cookieObj, strCookie) {
    var cookieValu = "";
    strCookie = $.trim(strCookie);
    var arrCookie = cookieObj.split(";");
    for (var i = 0; i < arrCookie.length; i++) {
        var arr = arrCookie[i].split("=");
        if (strCookie == $.trim(arr[0])) {
            cookieValu = $.trim(arr[1]);
            break;
        }
    }
    return cookieValu;
}

//获取缓存信息
function getStory(itemCode) {
    return JSON.parse(sessionStorage.getItem(itemCode));
}
//删除缓存信息
function removeStory(itemCode) {
    sessionStorage.removeItem(itemCode);
}

//设置缓存信息
function setStory(itemCode, itemValu) {
    sessionStorage.setItem(itemCode, JSON.stringify(itemValu));
}
//清空session
function clearSessionStroy(){
    sessionStorage.clear();
}

function clearLoclStory(){
    localStorage.clear();
}

function getLoclStory(itemCode) {
    return JSON.parse(localStorage.getItem(itemCode));
}
//删除缓存信息
function removeLoclStory(itemCode) {
    localStorage.removeItem(itemCode);
}

//设置缓存信息
function setLoclStory(itemCode, itemValu) {
    localStorage.setItem(itemCode, JSON.stringify(itemValu));
}

 

posted @ 2019-09-03 19:35  goodTOgreat  阅读(606)  评论(0编辑  收藏  举报