前端sessionStorage存储理解，登录信息存储

sessionStorage概念

浏览器窗口，sessionStorage是在同源的同窗口（或tab）中，始终存在的数据。也就是说只要这个浏览器窗口没有关闭，即使刷新页面或进入同源另一页面，数据仍然存在。关闭窗口后，sessionStorage即被销毁。同时“独立”打开的不同窗口，即使是同一页面，sessionStorage对象也是不同的。

sessionStorage多个标签页数据是否会共享问题

刷新当前页面，或者通过location.href、window.open、或者通过带target="_blank"的a标签打开新标签，之前的sessionStorage还在，
如果你是主动打开一个新窗口或者新标签，F12，sessionStorage空空如也。
也就是说，sessionStorage的session仅限当前标签页或者当前标签页打开的新标签页，通过其它方式新开的窗口或标签不认为是同一个session。

通过带target="_blank"的A标签、window.open等方式打开新窗口时，会把旧窗口（或标签）的sessionStorage数据带过去。但从此之后，新窗口（或标签）的sessionStorage的增删改和旧窗口已经没有关系了，如果只是在当前标签内跳转新页面（或者刷新），数据还会保留（前提当然是同域）。
总之，在处理sessionStorage时，只要打开新窗口就要特别注意了，新旧窗口数据不会互相同步。

登录信息sessionStorage存储

了解了sessionStorage特征，就会发现，登录信息用它存储非常合理，手动打开的tab页不会继承登录信息，sessionStorage为空，但是从当前页打开的页面，或者单页面应用页面，登录信息共存。

封装sessionStorage方法

function sessionSet(key, value) {
    if (typeof value === 'object') {
      value = JSON.stringify(value)
    }
    sessionStorage.setItem(key, value)
}

function sessionGet(key) {
    const value = sessionStorage.getItem(key) || '';
    try {
      const val = JSON.parse(value);
      if ('number' === typeof(val)){
          return value;
      } else {
          return val;
      }
    } catch (e) {
        return value;
    }
}

function sessionRemove(key) {
    sessionStorage.removeItem(key)
}

function sessionClearAll() {
    sessionStorage.clear();
}