在前端开发中，我们常常需要和 API 打交道，然而 API 返回的数据可能不太符合我们的使用需求。这时候，数据映射就可以派上用场了。而 @beardedtim/api-data-mapper 这个 npm 包就是专门用来做数据映射的。
安装
npm install @beardedtim/api-data-mapper --save
使用示例
假设我们有一个用户列表的 API，返回数据如下：
-- -------------------- ---- -------
-
--------- -
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
--
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
-
-
-我们需要将它映射为以下格式：
-- -------------------- ---- -------
-
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
-
-我们可以使用 @beardedtim/api-data-mapper 来做这个映射：
-- -------------------- ---- -------
------ - ------ - ---- -----------------------------
----- ------ - --- --------
------- ------ -- --------------- -- --
--- --------
----- ----------
------ -----------
---------- ---------------------------- ----
---------- ---------------------------- ----
----
--
----- ----------- - -
--------- -
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
--
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
-
-
-
----- ---------- - -----------------------
-----------------------输出结果为：
-- -------------------- ---- -------
-
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
-
-API
Mapper
Mapper 用来创建一个映射器。
构造函数
new Mapper(mapping)
参数
mapping{ object }映射规则。为一个对象，每个属性名为 API 返回数据中对应的字段名，值为一个函数，该函数接受数据并返回经过映射后的数据。
方法
map(data)
执行映射，返回映射后的数据。
data{ any }需要映射的数据。
进阶用法
嵌套映射
对于 API 返回数据中的复杂嵌套结构，我们可以让映射规则对应嵌套的部分。例如：
-- -------------------- ---- -------
-
--------- -
------- -
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
--
--------- -
-
----- --
-------- ----
------------- --------------------------
--
-
----- --
-------- ----
------------- --------------------------
-
-
-
-我们需要将它映射为以下格式：
-- -------------------- ---- -------
-
------- -
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
--------- -
-
----- --
-------- ----
------------ ------------
--
-
----- --
-------- ----
------------ ------------
-
-
-我们可以这样写映射规则：
-- -------------------- ---- -------
------ - ------ - ---- -----------------------------
----- ------ - --- --------
------- -
----- ------ -- --
--- --------
----- ----------
------ -----------
---------- ---------------------------- ----
---------- ---------------------------- ----
---
------- ------ -- --------------- -- --
--- --------
------ -----------
---------- ---------------------------- ----
----
--
--
----- ----------- - -
--------- -
------- -
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
--
--------- -
-
----- --
-------- ----
------------- --------------------------
--
-
----- --
-------- ----
------------- --------------------------
-
-
-
-
----- ---------- - -----------------------
-----------------------输出结果为：
-- -------------------- ---- -------
-
------- -
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
--------- -
-
----- --
-------- ----
------------ ------------
--
-
----- --
-------- ----
------------ ------------
-
-
-组合映射
有时候我们可能需要将多个 API 返回数据组合成一个数据结构。例如我们有一个用户列表 API 和一个订单列表 API，我们需要将它们组合为以下格式：
-- -------------------- ---- -------
-
-------- -
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
-
--
--------- -
-
----- --
-------- ----
------------ ------------
--
-
----- --
-------- ----
------------ ------------
-
-
-我们可以这样写映射规则：
-- -------------------- ---- -------
------ - ------ - ---- -----------------------------
----- ---------- - --- --------
------- ------ -- --------------- -- --
--- --------
----- ----------
------ -----------
---------- ---------------------------- ----
---------- ---------------------------- ----
----
--
----- ----------- - --- --------
------- ------ -- --------------- -- --
--- --------
------ -----------
---------- ---------------------------- ----
----
--
----- ------ - --- --------
------ --------------------------------
------- ----------------------------------
--
----- --------------- - -
--------- -
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
--
-
----- --
------- -------
-------- -----------------
------------- ---------------------------
------------- --------------------------
-
-
-
----- ---------------- - -
--------- -
-
----- --
-------- ----
------------- --------------------------
--
-
----- --
-------- ----
------------- --------------------------
-
-
-
----- ---------- - ------------
------ ----------------
------- -----------------
--
-----------------------输出结果为：
-- -------------------- ---- -------
-
-------- -
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
--
-
----- --
------- -------
-------- -----------------
------------ -------------
------------ ------------
-
--
--------- -
-
----- --
-------- ----
------------ ------------
--
-
----- --
-------- ----
------------ ------------
-
-
-总结
@beardedtim/api-data-mapper 这个 npm 包可以帮助我们做数据映射，让我们更加方便地处理 API 返回的数据。我们可以使用它来：
- 做简单的数据结构转化；
- 处理嵌套数据；
- 组合多个 API 返回数据。
希望这篇文章能够对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005553b81e8991b448d26e0