es6 class 封装缓存库的关键是统一处理数据类型、时效控制、错误容错和访问边界,而非简单包装 localstorage.setitem;需实现自动 json 转换、过期清理、私有状态隔离及多实例支持。

用 ES6 Class 封装缓存库,关键不是把 localStorage.setItem 包一层,而是统一处理数据类型、时效控制、错误容错和访问边界。核心目标是让调用者写 cache.set('token', {user: 'a'}, 3600000) 就能自动序列化、带过期时间、取值时自动校验并清理失效项。
基础封装:自动处理 JSON 转换与默认值
localStorage 只接受字符串,但业务代码总要存对象。基础类应在内部完成转换,对外隐藏细节:
- 构造时接收任意类型数据(字符串、数字、对象),
set()内部自动JSON.stringify -
get()返回前尝试JSON.parse,解析失败则返回预设默认值(如null或空对象),不抛错中断流程 - 提供
remove(key)和clear(),保持接口完整,避免直接操作原生 API
增强封装:支持有效期与自动过期清理
多数缓存需要“有时效”,比如登录态、临时配置。不能靠人工判断,应由类自身管理:
- 存数据时记录写入时间戳(
writeTime)和有效期毫秒数(period),可为undefined表示永久 -
get()调用时先读出原始数据,检查当前时间是否超过writeTime + period,超时则立即remove()并返回null - 不主动轮询清理,只在读取时惰性判断——轻量且无性能负担
安全封装:用私有字段隔离内部状态
防止外部绕过逻辑直接篡改 key、过期时间或原始数据结构:
- 使用 ES2022+ 私有字段语法(
#key、#default、#period),外部无法访问或赋值 - 仅暴露
get key()这样的只读 getter,不提供 setter - 所有写入操作必须走
set()方法,确保序列化、时间戳、错误兜底等逻辑必经
工程化封装:支持多实例与按需导入
真实项目中常需多个独立缓存域(如用户信息、系统配置、临时表单),不应强绑定单例:
- 类本身不维护全局实例,每个
new Cache('user')拥有独立 key 前缀和生命周期 - 导出的是类而非实例,便于在不同模块按需
import { Cache } from './cache' - 搭配 TypeScript 可加泛型约束,例如
new Cache<user>('user')</user>,提升类型安全











