lodash-es中的set和get的用法

混血哲谈2024-08-28 17:49

lodash-es 是 lodash 的一个模块化版本，允许你通过 ES 模块（ECMAScript Modules）的方式按需导入函数，以减少最终打包体积。lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。在 lodash-es 中，_.set 和 _.get 是两个非常有用的函数，用于在深层嵌套的对象中安全地读取和设置值。

`_.get`

_.get 函数用于从对象或数组中按照路径获取值。如果路径不存在，可以返回默认值。这对于避免在深度嵌套的对象中访问不存在的属性时引发错误非常有用。

语法：

javascript 复制代码

_.get(object, path, [defaultValue])

object (Object|Array)：要查询的对象或数组。
path (Array|string)：要查询的属性路径。字符串路径中的键可以使用点号（.）或方括号（[]）分隔。
[defaultValue] (*)：如果解析的值是 undefined，则返回此值。

示例：

javascript 复制代码

import { get } from 'lodash-es';

const object = { 'a': [{ 'b': { 'c': 3 } }] };

console.log(get(object, 'a[0].b.c'));
// => 3

console.log(get(object, ['a', '0', 'b', 'c']));
// => 3

console.log(get(object, 'a.b.c', 'default'));
// => 'default'

`_.set`

_.set 函数用于设置对象路径上的值。如果路径不存在，将创建它。这对于动态地向深层嵌套的对象添加属性非常有用。

语法：

javascript 复制代码

_.set(object, path, value)

object (Object|Array)：要修改的对象或数组。
path (Array|string)：要设置的属性路径。字符串路径中的键可以使用点号（.）或方括号（[]）分隔。
value (*)：要设置的值。

示例：

javascript 复制代码

import { set } from 'lodash-es';

const object = { 'a': [{ 'b': { 'c': 3 } }] };

_.set(object, 'a[0].b.c', 4);
console.log(object.a[0].b.c);
// => 4

_.set(object, ['x', '0', 'y', 'z'], 5);
console.log(object.x[0].y.z);
// => 5

通过这两个函数，你可以灵活地在 JavaScript 对象或数组中读取和设置值，而无需担心路径是否存在。这在处理复杂的数据结构时特别有用。