摘要：實(shí)現(xiàn)模塊有其他頁面取被清空了被修改了引用此模塊并執(zhí)行拿到的函數(shù)存入獲取刪除清空此時基本實(shí)現(xiàn)了的基礎(chǔ)功能，，，，。

sessionStorage的局限:

??sessionStorage是頁面級別的，僅在一個標(biāo)簽頁生效，如果同一個瀏覽器同時打開多個標(biāo)簽頁，且都訪問同一個域名，sessionStorage是不會在這多個標(biāo)簽頁共用的，即每個標(biāo)簽頁都有自己的sessionStorage。
??如果想突破這種局限，實(shí)現(xiàn)多tab頁共享存取數(shù)據(jù)同時又有sessionStorage暫存性的功能（關(guān)閉頁面時存在里面的數(shù)據(jù)也消失的功能），則需要自己通過一些技巧實(shí)現(xiàn)手動維護(hù)多tab頁面內(nèi)存儲某個對象的數(shù)據(jù)，就是目前我想要講的方法。
??方法：通過給localStorage存儲數(shù)據(jù)，可以在全瀏覽器內(nèi)捕獲一個storag的事件，然后再拿到該事件傳過來的數(shù)據(jù)進(jìn)行本地修改維護(hù)，多個tab頁就以此通信，同步數(shù)據(jù)。

實(shí)現(xiàn)(es6 模塊)：

const MemoryStorage =  class {
    constructor(){
        this._data = {};
    }
    setItem(k, v){
        this._data[k] = v;
        MemoryStorage.dataSendHandler( this._data );
    }
    getItem(k){
        return this._data[k];
    }
    removeItem(k){
        delete this._data[k];
        MemoryStorage.dataSendHandler( this._data );
    }
    clear(){
        this._data = {};
        MemoryStorage.dataSendHandler( this._data );
    }
    getData() {
        return this._data;
    }
    setData(data) {
        this._data = data
    }
    mergeToData(data) {
        for(let k in data) {
            this._data[k] = data[k]
        }
    }
    static dataSendHandler( data ){
        localStorage.setItem("setMemoryStorage", JSON.stringify(data));
        localStorage.removeItem("setMemoryStorage");
    }
    static dataGetHandler(){
        localStorage.setItem("getMemoryStorage", new Date().getTime());
        localStorage.removeItem("getMemoryStorage");
    }
}
const initMemoryStorage = function(){
    var memoryStorage = new MemoryStorage();
    window.addEventListener("storage",function(e){
        if( e.newValue===null ) return false;
        if(e.key == "getMemoryStorage"){
            console.log("有其他頁面取memory")
            MemoryStorage.dataSendHandler( memoryStorage.getData() );
        }
        else if(e.key == "setMemoryStorage"){
            let data = JSON.parse(e.newValue);
            if( isEmptyObj(data) ){
                console.log("memory被清空了")
                memoryStorage.setData({});
            }else{
                console.log("memory被修改了")
                memoryStorage.mergeToData(data)
            }
        }
    })
    if( isEmptyObj(memoryStorage.data) ){
        MemoryStorage.dataGetHandler();
    }
    return memoryStorage;
}
function isEmptyObj(obj){
    for(let i in obj){
        return false;
    }
    return true;
}
export default initMemoryStorage;

引用此模塊并執(zhí)行拿到的函數(shù)

import memory from "multitabstorage"
window.memoryStorage = memory();

window.memoryStorage.setItem("Auth", "as00f0e058585856d"); //存入Auth
var Auth = window.memoryStorage.getItem("Auth");           //獲取Auth
window.memoryStorage.removeItem("Auth");                   //刪除Auth
window.memoryStorage.clear();                              //清空storage

此時memoryStorage基本實(shí)現(xiàn)了sessionStorage的基礎(chǔ)功能，setItem， getItem，removeItem，clear。

https://github.com/JhonMr/multitabstorage

npm install multitabstorage