JavaScript中的记忆化是一种通过缓存函数计算结果来提升性能的技术，核心思路是当函数被调用时，先检查当前参数对应的结果是否已经缓存，如果已经存在则直接返回缓存值，否则执行计算并将结果存入缓存。这种技术对于参数相同、计算成本高的函数优化效果非常明显，比如斐波那契数列计算、复杂数据转换等场景。
记忆化的核心实现原理
记忆化的实现需要满足两个基本条件：一是能够唯一标识函数的调用参数，二是能够存储和快速读取缓存的结果。通常我们会用一个缓存容器来存储参数和结果的映射关系，每次函数调用时先处理参数生成缓存键，再根据键查询缓存。
基于普通对象的实现方案
这是最基础的记忆化实现方式，使用普通对象作为缓存容器，将参数拼接成字符串作为缓存键。这种方式实现简单，适合参数类型为基础类型、且参数顺序固定的场景。
// 基础记忆化函数实现
function memoize(fn) {
// 缓存容器，存储参数键和对应结果
const cache = {};
return function(...args) {
// 将参数转换为字符串作为缓存键，处理基础类型参数
const key = args.join('_');
// 如果缓存中已有当前键的结果，直接返回
if (cache.hasOwnProperty(key)) {
return cache[key];
}
// 执行原函数计算结果
const result = fn.apply(this, args);
// 将结果存入缓存
cache[key] = result;
return result;
};
}
// 测试：斐波那契数列计算函数
function fibonacci(n) {
if (n <= 1) return n;
return fibonacci(n - 1) + fibonacci(n - 2);
}
// 生成记忆化版本的斐波那契函数
const memoizedFibonacci = memoize(fibonacci);
// 第一次调用会计算
console.log(memoizedFibonacci(10)); // 输出55
// 第二次调用相同参数，直接返回缓存结果
console.log(memoizedFibonacci(10)); // 输出55
基于Map对象的实现方案
普通对象的缓存键只能是字符串或Symbol类型，当参数是对象、数组等引用类型时，拼接字符串的键会出现问题。使用Map作为缓存容器可以支持任意类型的参数作为键，更适合复杂参数的场景。
// 基于Map的记忆化实现
function memoizeWithMap(fn) {
// 使用Map作为缓存容器，支持任意类型参数作为键
const cache = new Map();
return function(...args) {
// 将参数数组作为Map的键
const key = args;
// 检查缓存中是否有当前键的结果
if (cache.has(key)) {
return cache.get(key);
}
// 执行原函数计算结果
const result = fn.apply(this, args);
// 存入缓存
cache.set(key, result);
return result;
};
}
// 测试：接收对象参数的函数
function getUserInfo(user) {
// 模拟接口请求耗时
return `用户${user.name}，年龄${user.age}`;
}
const memoizedGetUserInfo = memoizeWithMap(getUserInfo);
const user1 = { name: '张三', age: 20 };
// 第一次调用
console.log(memoizedGetUserInfo(user1)); // 输出用户张三，年龄20
// 第二次调用相同对象引用，返回缓存结果
console.log(memoizedGetUserInfo(user1)); // 输出用户张三，年龄20
两种实现方案的对比
不同实现方案有不同的适用场景，我们可以通过下表对比两者的差异：
| 对比维度 | 基于对象的实现 | 基于Map的实现 |
|---|---|---|
| 缓存键类型 | 仅支持字符串、Symbol | 支持任意JavaScript类型 |
| 引用类型参数支持 | 不支持，相同内容的对象会生成不同键 | 支持，但相同内容的不同对象引用会视为不同键 |
| 实现复杂度 | 简单，无需额外API | 稍复杂，需要了解Map的使用 |
| 适用场景 | 参数为基础类型、计算逻辑简单 | 参数包含引用类型、需要更灵活的键管理 |
实现注意事项和优化技巧
- 缓存键的生成需要保证唯一性，如果参数是对象类型，可以考虑使用JSON.stringify将对象序列化作为键，但要注意对象属性顺序和循环引用的问题。
- 记忆化会增加内存占用，对于调用次数少、计算成本低的场景不建议使用，避免不必要的内存消耗。
- 如果原函数有副作用，比如修改外部变量、发送请求等，使用记忆化可能会导致副作用只执行一次，需要提前评估函数的适用性。
- 可以设置缓存的最大容量，当缓存数量超过阈值时删除最早的缓存项，避免内存溢出。
// 带最大缓存容量的记忆化实现
function memoizeWithLimit(fn, limit = 10) {
const cache = new Map();
return function(...args) {
const key = args;
if (cache.has(key)) {
// 如果缓存存在，将键移到Map的末尾，代表最近使用
const value = cache.get(key);
cache.delete(key);
cache.set(key, value);
return value;
}
const result = fn.apply(this, args);
cache.set(key, result);
// 超过缓存限制，删除最早的缓存项
if (cache.size > limit) {
const firstKey = cache.keys().next().value;
cache.delete(firstKey);
}
return result;
};
}
实际开发中的应用场景
记忆化在以下场景中非常实用：
- 递归函数优化：比如树形数据遍历、动态规划相关的递归计算，避免重复计算子问题。
- 复杂数据转换：比如将接口返回的扁平数据转换为树形结构，相同输入无需重复转换。
- 高频调用的工具函数：比如日期格式化、数据校验等函数，相同参数的调用可以直接返回缓存结果。
合理使用记忆化可以有效提升JavaScript代码的执行效率，但需要根据实际场景选择合适的实现方案，同时注意缓存带来的内存和副作用问题，才能发挥记忆化的最大价值。
JavaScript记忆化函数缓存memoization修改时间：2026-06-10 12:57:35