用Map做局部缓存的核心是“按需存储+键值映射+避免重复计算”，因其支持任意类型key、插入顺序遍历、内置size/clear/has等方法，比普通对象更适配计算属性中以参数对象为key的场景。
用 Map 做局部缓存，核心是“按需存储 + 键值映射 + 避免重复计算”，尤其适合计算属性中依赖动态参数、但实际输入组合有限的场景。
为什么不用普通对象而选 Map？
Map 支持任意类型作 key（比如对象、函数、Symbol），而普通对象只能用字符串或 Symbol；Map 的键值对顺序与插入顺序一致，遍历更可预测；Map 提供 size 属性和 clear()、has() 等方法，操作更直观。计算属性里常要拿整个参数对象当 key，这时 Map 是更自然的选择。
在计算属性中封装缓存逻辑
把耗时计算包裹进一个带 Map 缓存的函数，每次先查缓存，命中则直接返回，未命中则执行计算并存入 Map。注意 key 要能唯一标识输入——常用 JSON.stringify(params)（仅限纯 JSON 数据），或用 createCacheKey(...args) 手动拼接（推荐用于含函数、Date、RegExp 等不可序列化值的场景）。
- 缓存 key 尽量扁平：避免用整个大型响应式对象，提取关键字段构造 key
- 控制缓存生命周期：不需要长期保留时，可在组件卸载或数据重置时调用 map.clear()
- 谨慎共享 Map 实例：多个计算属性共用一个 Map 时，key 设计必须全局唯一，否则可能误命中
Vue 3 中的实用写法示例
在 setup() 或 computed() 内部定义局部 Map：
const resultCache = new Map()
const expensiveResult = computed(() => {
const key = `${props.id}-${props.type}-${props.filter}`
if (resultCache.has(key)) {
return resultCache.get(key)
}
const value = heavyCalculation(props.id, props.type, props.filter)
resultCache.set(key, value)
return value
})
若参数是对象，可用 JSON.stringify({ id, type, filter }) 生成 key；如含响应式引用，建议解构后再序列化，避免触发不必要的依赖收集。
什么时候不该用？
输入组合极多（如实时搜索关键词），会导致 Map 持续膨胀，应配合 LRU 策略或改用防抖 + 请求级缓存；计算本身极快（如简单加减），加缓存反而增加开销；参数含无法稳定序列化的值（如 Date 实例每次 new 都不同），需统一转为时间戳等规范格式再作为 key。
