劃重點：
sessionstorage不能跨tab頁
設定過期時間在原有的原生api基礎上封裝，存在key的過期資料
眾所周知，前端三大快取，cookie，sessionstorage，localstorage，cookie空間太小，一旦大了，會消耗流量，只適合存一些登入會話資訊，而sessionstorage的過期時間就是關閉瀏覽器，是個臨時會話視窗，但是，最近這個差點把我坑了，就是sessionstorage只能在同一標籤下共享，加入你把**複製貼上到新開啟的標籤頁裡面，你會驚喜的發現，what？居然不共享，這不坑爹呢嗎？咳咳。。還有就是localstorage了，這個好處就是儲存空間大，長時間儲存，同一瀏覽器，標籤頁全部共享，它是直接存到電腦硬碟上的，不好的是，它是永久有效的，除非手動改清除，否則它會在你電腦裡待上一輩子，供他吃好的喝好的，也就是無法設定失效時間，但是我還真不服了，憑什麼我用你就得養你一輩子，哼哼，於是我就自己簡單封裝一下，讓它可以設定失效時間，下面我們用es6的類來封裝
class storage以上就是全部**了，diamagnetic說明我全部寫在注釋裡了，我封裝的這個還有個好處就是，你存進去是什麼型別的值，取出來還是什麼型別的值，比如你存進去是個物件，取出來還是個物件，用不著轉型別了，大家都知道快取只支援字串型別的資料，但是我這裡面已經幫你做好了封裝，你只管存和取就可以了，下面我們來試試效果//設定快取
setitem(params) ;
let options ={};
//將obj和傳進來的params合併
object.assign(options, obj, params);
if(options.expires)
else
if (object.prototype.tostring.call(options.value) == '[object array]')
localstorage.setitem(options.name, options.value);
}}
//拿到快取
getitem(name)
catch
(error)
//如果有starttime的值，說明設定了失效時間
if(item.starttime)
else
} else
} //移出快取
removeitem(name)
//移出全部快取
clear()
}
設定失效時間
let storage = new下面我把值取出來storage();
storage.setitem();
let value = storage.getitem('name');
console.log('我是value',value);
下面我們設定時間短一點，5秒，然後再取出來
在我寫的這個功夫應該已經過期了，我們取出來
let value = storage.getitem('name');
console.log('我是value',value);
false就說明過期了，快取也給刪掉了
下面我們檢驗存進去的型別和取出來的型別
普通字串以上已經試過了，現在試試物件
storage.setitem(,重點來了，我們直接取});
let value = storage.getitem('name');
console.log('我是value',value);
直接就取出來了
。。。。。。。。。。。。。。。。。
下面再試試陣列物件
storage.setitem(,,],我們直接取出來});
let value = storage.getitem('name');
console.log('我是value',value);
localStorage時效設定
css box contentk contentk div contentk input contentk input webkit input placeholder aging aging div nth child 2 label btn,btn1 html class box class c...
獲取和設定localStorage
東鈿金融服務平台 使用者第一次訪問頁面出現，引導步驟，起初一直使用cookie，但是cookie一直不穩定 簡單介紹和使用了localstorage 在我的頁面上就只是用了 獲取localstorage，和設定localstorage。思路和邏輯 和cookie是一樣的，如下 var a local...
如何設定LocalStorage過期時間
前端快取cookie localstorage sessionstorage 根據業務場景不同來選擇使用 老生常談的對比來說 cookie 儲存量小。sessionstorage 儲存週期僅僅到瀏覽器關閉，儲存量是夠了，用起來也真是夠了，無法多個tab頁共享。侷限性也很大。localstorage ...