面试官问：怎么让localStorage像cookie那样有过期时间

Posted 2022-11-30 _阿锋丶

思路

昨天被面试官问到时有点蒙，今天考察了一下，l利用封装的思想,只用在设置一个key的是再携带设置另一个时间key，另一个key为你想设置的它的最大生命周期就可以了。获取的时候比较一下这个时间key，如果过期了就remove，获取不到

实现

需要自定义set和get方法

自定义set()

    function set(key, value, expired) 
      // 设置好要存储的值
      console.log(key, value);
      localStorage.setItem(JSON.stringify(key), JSON.stringify(value))

      //根据设置好存储值的key 再在localStorage设置另一个关联它的最大生存时间
      if (expired) 
        localStorage.setItem(`$key__expires__`, Date.now() + 1000 * 60 * expired)
      
      return value
    

    set('key', 'wangfeng', 0.1)

运行了一下

自定义get()

    function get(key) 
      // 取出当前key的最大生存周期时间
      let expired = localStorage.getItem(`$key__expires__`) || Date.now() + 1

      // 比较当前时间是否过期
      let now = Date.now()
      if (now > expired) 
        localStorage.removeItem(JSON.stringify(key))
        localStorage.removeItem(`$key__expires__`)
        return
      
      return localStorage.getItem(JSON.stringify(key)) ? JSON.parse(localStorage.getItem(JSON.stringify(key))) : localStorage.getItem(JSON.stringify(key))

    


    console.log(get('key'));

运行：
上面最大生存时间我 设置是 0.1 分钟
超过时间了 获取不到了，

参考：https://segmentfault.com/a/1190000016892019