javascript之本地緩存

在客戶端運行的JS是不能操做用戶電腦磁盤中的文件(爲了保護客戶的安全) JS中的本地存儲： 使用JS向瀏覽器的某一個位置中存儲一些內容，瀏覽器即便關閉了，存儲的信息也不會銷燬，當再從新打開瀏覽器的時候咱們依然能夠獲取到上一次存儲的信息 一、本地存儲的方案： 傳統： 一、cookie：把信息存儲到客戶端的瀏覽器中(可是項目服務器也是能夠獲取的) 二、session：把信息存到服務器上的(服務器存儲) HTML5：webStorage 一、localStorage：永久的存儲到客戶端的本地 二、sessionStorage：信息的會話存儲，會話窗口存在信息也存在，會話窗口關閉信息就消失了 二、cookie localStorage sessionStorage webStorage： setItem([key],[value])：向客戶端的本地存儲一條記錄，存儲的[value]須要時字符串格式，若是編寫的不是字符串，瀏覽器也會默認轉化爲字符串，而後再進行存儲，同源下存儲的[key]是不會重複的，若是以前有的話，是把存儲的信息從新的進行修改 getItem([key])：獲取以前存儲的值 removeItem([key])：移除 clear()：把當前源下全部的存儲記錄都移除掉 localStorage.length：獲取本地一共存儲的數量 localStorage.key(0)：獲取索引爲0的這一項的值 localStorage.setItem('age', 1) //存儲 localStorage.getItem('age') //獲取

localStorage 和 sessionStorage 的區別：
    localStorage屬於永久存儲到本地，無論是刷新頁面仍是關掉頁面或者是關掉瀏覽器，存儲的內容都不會消失，只有咱們本身手動的去刪除纔會消失(無論是殺毒軟件仍是瀏覽器自帶的清除功能都不能把localStorage存儲的內容移除掉)
    sessionStorage屬於臨時會話存儲，只要當前的頁面不關閉，信息就能夠存儲下來，可是頁面一旦關閉，存儲的信息就會自動清除(F5刷新頁面只是把當前的DOM結構從新渲染，然而會話並無關閉)

    cookie：
        document.cookie = "age=7"  //存儲；
        escape && unespace 能夠對中文的字符串進行編碼和解碼，防止存儲的時候亂碼
        var str = '培訓';
        var n = escape(str)   // 對str進行編碼
        var m = unescape (n)  // 對n進行解碼
        其餘編碼解碼的方式：encodeURI()   decodeURI()   encodeURIComponent()

cookie方法的封裝：

`` var cookieRender = (function () {

//設置

function setValue(options) { var _default = { name: null, value: null, expires: new Date(new Date().getTime() + (1000 * 60 * 60 * 42)), path: '/', domain: '' }

for (var key in options) {
  if (options.hasOwnProperty(key)) {
    _default[key] = options[key];
  }
}
document.cookie = _default.name + '=' + escape(_default.value) + ";expires=" + _default.expires.toGMTString() + ";path=" + _default.path + ";domain = " + _default.domain

}

//獲取

function getValue(name) { var arr = document.cookie.math(new RegExp("(^| )" + name + "=([^;]*)(;|$)")); if(arr != null) { return unescape(arr[2]); } return null }

//刪除

function removeValue(options) { var _default = { name: null, path: '/', domain: '' }

for (var key in options) {
  if (options.hasOwnProperty(key)) {
    _default[key] = options[key];
    }
  }
if(getValue(_default.name)){
  document.cookie = _default.name + "=" + "; path=" + _default.path + "; domain=" + _default.domain + ";expires = 過時時間"
}

}

return { set:setValue, get:getValue, remove:removeValue } })();

cookie 和localStorage的區別：
    一、cookie兼容全部的瀏覽器，localStorage不兼容IE6~8
    二、cookie存儲內容的大小是有限制的，通常同源下只能存儲4KB的內容，localStorage存儲的內容也有大小限制，通常同源下只能存儲5MB；
    三、cookie有過時時間，localStorage是永久性的，
    四、用戶可能處於安全的角度禁用cookie(無痕瀏覽)，可是不能禁止localStorage
    

    真實項目中的本地存儲都是用那些東西
    cookie：記住用戶名密碼或者自動登陸；用戶的部分信息，當用戶登陸成功後，咱們會把用戶的一些信息記錄到本地cookie中，這樣在項目中的任何頁面均可以知道當前均可以知道當前登陸的用戶是哪個了...(存儲少許信息或者是須要瀏覽器金融的都須要使用cookie來進行存儲)
    localStorage：咱們能夠存儲某一個JS或者css中的源代碼；還能夠把一些不須要更新的數據存儲到本地，存儲的時候能夠設置一個存儲的時間，之後從新刷新頁面，看一下時間有沒有超過預約的時間，若是已經超過了，咱們從新獲取最新數據，沒超過咱們使用本地數據；
    
    本地存儲都是明文存儲
    對於重要的信息咱們通常不要存儲到本地，若是非要存儲的話咱們須要把存儲的信息進行加密
        可逆轉加密：加密完成還能夠解密回來
        不可逆轉加密：MD5