一、Window.localStorage

（1）只读的localStorage 属性允许你访问一个Document 源（origin）的对象
Storage；存储的数据将保存在浏览器会话中。
（2）与sessionStorage区别：存储在 localStorage的数据可以长期保留；而当页面会话结束——也就是说，当页面被关闭时，存储在 sessionStorage 的数据会被清除。

二、语法

• localStorage 中的键值对总是以字符串的形式存储

☀️ 我们可以使用它提供的getItem、serItem、removeItem、clear这几个API对当前域名下的本地Storage对象进行“增读删”操作。美中不足的是，相比于cookie，localStorage不能设置过期时间。

问题描述

在实际的应用场景中, 我们往往需要让 localStorage 设置的某个 「key」 能在指定时间内自动失效, 所以基于这种场景, 我们如何去解决呢?

1、定时器

localStorage.setItem('dooring', '123456')
// 设置一小时的有效期
const expire = 1000 * 60 * 60;
setTimeout(() => {
  localStorage.setItem('password', '')
}, expire)

😑但是当要设置任意键的有效期，就需要编写很多个定时器，维护成本很高，没有复用性。

2、二次封装localStorage API

真不错

3、使用xiji第三方根据库

// 终端安装 npm i xiji
import { store } from 'xijs';
// 设置带有过期时间的key
store.set('name', 'dooring', Date.now() + 1000);
console.log(store.get('name'));
setTimeout(() => {
  console.log(store.get('name'));
}, 1000);

// 设置成功后的回调
store.set('dooring', 'xuxiaoxi', Date.now() + 1000, (status, key, value) => {
  console.log('success');
});