前言
在开发前端应用时，我们经常需要处理异步操作。在某些情况下，我们需要确保异步操作只执行一次，而不是每次调用函数都要重新执行异步操作。在这种情况下，可以使用 thunky 库来简化代码。
thunky 是一个小型的 npm 模块，用于将异步函数转换为惰性函数，以确保异步操作只执行一次。本文将介绍如何使用 thunky 来优化你的前端代码。
安装 thunky
在使用 thunky 之前，你需要先安装它。你可以通过以下命令在你的项目中安装 thunky：
npm install thunky --save
使用 thunky
使用 thunky 很简单。首先，你需要将你的异步函数传递给 thunky 函数，然后使用返回的惰性函数来执行异步操作。
以下是一个示例：
-- -------------------- ---- -------
----- ------ - -----------------
-------- --------------------- -
------------- -- -
-------------- - ----- ------- ---- -- --
-- -----
-
----- ----------------- - -------------------
----------------------- ----- -- -
-- ----- -
------------------
------
-
---------------------- -- -- ----
--
-- ---- ----------------- -------------------
----------------------- ----- -- -
-- ----- -
------------------
------
-
--------------------- -- -- --
--在上面的示例中，我们首先定义了一个名为 getUserData 的异步函数，它将在 1 秒后返回用户数据对象。然后，我们使用 thunky 将该函数转换为惰性函数，存储在 getUserDataThunky 变量中。最后，我们调用 getUserDataThunky，并在回调函数中处理结果。
当第二次调用 getUserDataThunky 时，由于 thunky 已经将函数缓存起来，异步操作不会再次执行。相反，thunky 会立即返回缓存的结果。
深入学习 thunky
除了基本用法之外，还有一些高级用法可以帮助你更好地理解和使用 thunky。
自定义缓存
默认情况下，thunky 会将执行结果缓存在内存中，以避免多次执行异步操作。但是，如果你希望使用自定义的缓存方式，则可以传递一个可选的缓存对象作为第二个参数。
以下是一个示例：
-- -------------------- ---- -------
----- ------ - -----------------
----- ----- - --
-------- ------------ --------- -
------------- -- -
-------------- ----- --- - - ----
-- -----
-
----- ------------- - --------------- -
---- ----- -- -----------
---- ----- ------ -- - ---------- - ----- --
---- ----- -- - ------ ---------- -
--
-------------------- ----- ----- -- -
-- ----- -
------------------
------
-
----------------- -- -- ----- --- ----
--
-- ------------
-------------------- ----- ----- -- -
-- ----- -
------------------
------
-
----------------- -- -- ----- --- ----
--在上面的示例中，我们创建了一个名为 cache 的自定义缓存对象，并将其传递给 thunky。然后，我们使用 get、set 和 del 方法实现了自定义的缓存逻辑。最后，我们调用 getDataThunky 函数两次来检查缓存是否正常工作。
错误处理
当异步操作失败时，thunky 将会将错误信息传递给回调函数。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/47441