LocalStorage设置过期时间

三大缓存，cookie, sessionStorage, localStorage. cookie 空间太小为 4KB，一旦大了会消耗流量，只适合存一些登录会话信息，而sessionStorage 的过期时间是关闭浏览器，是个临时会话窗口，只能在同一标签下共享。不同 tab 之间是不共享的。localStorage 存储空间大，但是持久化存储，需要手动清除否则会一直存在浏览器中。 封装localStorage可以设置时效时间

class Storage {
  constructor(name) {
    this.name = 'storage';
  }
  // 设置缓存
  setItem(params) {
    let obj = {
      name: '',
      value: '',
      expires: '', // 失效时间
      startTime: new Date().getTime(),// 记录存入时间
    }
    let option = {};
    // 将 obj 和传进来的 params 合并
    Object.assign(option, obj, params);
    if (option.expires) {
      // 如果 option.expires 设置了的话
      // 以 option.name 为 key，option为值放进去
      localStorage.setItem(option.name, JSON.stringify(option)) 
    } else {
      // 如果 option.expires 没有值，就判断一下value 的类型
      let type = Object.prototype.toString.call(option.value);
      // 如果 value 是对象或者数组对象的类型，就先用 JSON.stringify 转一下，再存进去
      if(Object.prototype.toString.call(obj.value) === '[object object]' || Object.prototype.toString.call(obj.value) === '[object Array]') {
        option.value = JSON.stringify(option.value);
      }
      localStorage.setItem(option.name,option.value);
    }
  }
  // 取缓存
  getItem(name){
    let item = localStorage.getItem(name);
    // 先试着进行 json 转换为对象形式
    try {
      item = JSON.parse(item);
    } catch(err) {
      // 不是json 则直接返回
      item = item;
    }
    // 有 startTime 代表设置了失效时间
    if (item.startTime) {
      let date = new Date().getTime();
      if (date - item.startTime > item.expires) {
        //  缓存过期了
        localStorage.removeItem(name);
        return;
      } else {
        // 未过期，返回
        return item.value;
      }
    } else {
      // 没有失效时间，则直接返回结果
      return item;
    }
  }
  // 移除缓存
  removeItem(name) {
    localStorage.removeItem(name);
  }
  // 移除全部缓存
  clear() {
    localStorage.clear();
  }
}