在前端开发中，经常需要从一个复杂的对象中获取指定的值，这时候我们可以使用 object-picker 生成器来创建一个定制化的对象解析器，轻松获取我们所需的值。本文将介绍 object-picker 的使用方法和相关注意事项，帮助大家更好地进行开发工作。
安装
我们可以使用 npm 包管理工具来安装 object-picker：
npm install object-picker
如何使用
下面是 object-picker 的基本用法：
-- -------------------- ---- -------
----- ------------ - -------------------------
----- ------ - -
--- --
------ -------------- ------
------- -
----- -----
------ -----------------------
-
--
----- ------ - --------------
--- -----
------ --------
----------- --------------
------------ --------------
---
----- ------ - --------------------
-------------------- -- --- - --- -- ------ -------------- ------ ----------- ----- ------------ -----------------------解析器配置
在上面的例子中，我们可以看到我们在创建 picker 时，传递了一个解析器配置对象，该对象用来定义我们想要获取的值的结构，其格式如下：
const picker = objectPicker({
'指定的值的属性名': '获取该值的路径',
...
});例如：
const picker = objectPicker({
id: 'id',
authorName: 'author.name',
authorEmail: 'author.email'
});上面的代码配置了一个解析器，用来获取 source 对象中的 id，以及 author 对象中的 name 和 email 字段。
高级用法
除了基本使用方法外，object-picker 还提供了许多高级的用法，帮助我们更好地进行对象解析工作。
深度解析
object-picker 支持深度解析，通过传递一个数组来指定多层结构。例如：
const picker = objectPicker({
city: ['location', 'address', 'city'],
state: ['location', 'address', 'state'],
});上面的例子定义了一个解析器，用来获取 source 对象中的位于 location.address 属性内的 city 和 state 字段。
默认值
当解析器无法获取到指定的值时，我们可以通过传递一个默认值来为该值设置默认值。例如：
const picker = objectPicker({
city: ['location', 'address', 'city'],
state: ['location', 'address', 'state', 'unknown', 'defaultState'],
}, {
defaultState: 'CA'
});上面的代码定义了一个解析器，当解析器无法获取 source 对象中的 state 字段时，会默认返回 'CA'。
过滤器
使用 object-picker，我们可以通过传递过滤器函数来过滤值。例如：
const picker = objectPicker({
time: 'createdAt',
amount: 'totalPrice',
}, {
createdAt: (val) => Date.parse(val),
totalPrice: (val) => val.toFixed(2)
});我们在上面的配置中，定义了一个解析器，用来获取 source 对象中的 createdAt 和 totalPrice 字段，并分别应用了一个时间戳过滤器和一个保留两位小数的过滤器。
总结
通过本文的讲解，我们了解了 npm 包 object-picker 的使用方法和常见技巧。希望此篇文章对你有帮助，能让你更加快速、高效地解析对象。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f9c3d1de16d83a66e67