随着前端应用的日益复杂，在大量的计算和数据处理中，性能问题越来越成为前端开发者的头号烦恼。优化的一个手段之一就是 memoization（记忆化）。memoization 是一个通过缓存实现性能优化的概念。在函数的计算过程中，我们可以缓存函数的输入和输出结果，这样当下一次输入相同的参数时，我们可以直接从缓存中读取结果，避免重新计算，提高性能。
memoize.js 是一个工具库，专门为 JavaScript 进行 memoization 提供帮助。下面我们将详细介绍如何使用 memoize.js 。
安装
可以通过 npm 安装 memoize.js:
npm i memoizee
当然你也可以使用 yarn：
yarn add memoizee
使用
memoize.js 支持对任意函数进行记忆化，记忆化后的函数可以缓存结果，当再次调用时，会直接从缓存中获取结果，而不是再次执行函数。
针对普通函数
针对普通函数的记忆化处理非常简单，只需使用 memoize 函数，将要记忆化的函数作为参数传入即可：
-- -------------------- ---- ------- ----- ------- - -------------------- -------- ------------ - ------ - - - - - - - - ----------- - --- - ----- ----------------- - ------------------- ---------------------------------- -- --- ---------------------------------- -- ---- ----- ---------------------------------- -- ---
memoize 函数的第二个参数可以指定一个选项对象，包括了许多相关的选项：
maxAge: 缓存的最长时间，单位是毫秒。preFetch: 是否在参数传入时就计算结果而不是在第一次调用时计算。primitive: 是否缓存原始类型的值（number, boolean, string）。async: 是否只针对异步函数使用。normalizer: 缓存键的生成函数，用户可以手动指定。
针对类的方法
针对类的方法的记忆化与普通函数的记忆化类似，只需要特别注意 this 的问题。由于箭头函数没有自己的 this，所以使用箭头函数记忆化类方法非常方便。
-- -------------------- ---- -------
----- ------- - --------------------
----- ---------- -
------ -- -
------------------------------
------ - - --
-
-
----- ---------- - --- -------------
----- ----------- - ----------------------------------------- -- ----- ---- ---
-------------------------- ---- -- -------------- -
-------------------------- ---- -- -- -----
-------------------------- ---- -- -------------- -使用 ES6 class 定义的函数有一个问题：它们使用了严格模式。在严格模式下，this 不被允许自动转换为全局对象 window。因此，当用记忆化函数装饰某一个函数或方法时，要先将函数或方法 bind 到正确的 this 之上，这样 memoize 才能正常工作。
使用示例
下面我们来实际使用 memoize.js 解决一个经典面试题：斐波那契数列(fibonacci)的 memoization 优化。
-- -------------------- ---- -------
----- ------- - --------------------
-------- ------------ -
-- -- - -- -
------ --
-
------ -------------- - ---------------
-
----- ---------------- - -------------------
---------------- ----------
---------------------------
------------------- ---------- -- ------- -- --
------------------ ----------
----------------------------------
--------------------- ---------- -- ------- ---- --可以看到，通过 memoization，我们成功将执行 fibonacci 函数所需要的时间从几秒缩短为几毫秒。
总结
memoize.js 是一个非常优秀的记忆化库。在需要极致性能的场景下，memoization 是一个不错的选择。memoize.js 的记忆化处理非常简单，而且随着适当的选项配置，非常有弹性。愿此篇文章能帮助你用 memoize.js 记忆化你的前端应用中各种复杂的计算。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005570d81e8991b448d3f72