在 JavaScript 中,更新嵌套数组中的对象属性可以通过多种方法实现,包括原生 JavaScript 和使用 Lodash 库。以下是一些示例,展示如何使用这两种方法来更新嵌套数组中的对象属性。
假设我们有以下嵌套数组:
const data = [
{
id: 1,
name: 'John',
children: [
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Jack' }
]
},
{
id: 4,
name: 'Doe',
children: [
{ id: 5, name: 'Jill' },
{ id: 6, name: 'James' }
]
}
];
我们希望更新 id
为 3
的对象的 name
属性。
使用递归函数来遍历嵌套数组并更新目标对象的属性。
function updateNestedArray(arr, targetId, newName) {
for (let item of arr) {
if (item.id === targetId) {
item.name = newName;
return true; // 找到并更新后返回
}
if (item.children) {
const found = updateNestedArray(item.children, targetId, newName);
if (found) return true; // 如果在子数组中找到并更新,返回
}
}
return false; // 未找到目标对象
}
updateNestedArray(data, 3, 'Jackson');
console.log(JSON.stringify(data, null, 2));
Lodash 提供了一些有用的工具函数,可以简化嵌套结构的处理。我们可以使用 _.cloneDeep
和 _.set
来实现这一点。
首先,确保你已经安装了 Lodash:
npm install lodash
然后,你可以使用 Lodash 来更新嵌套数组中的对象属性:
const _ = require('lodash');
function updateNestedArrayWithLodash(arr, targetId, newName) {
const clonedArr = _.cloneDeep(arr); // 深拷贝数组,避免修改原数组
const stack = [...clonedArr];
while (stack.length) {
const item = stack.pop();
if (item.id === targetId) {
item.name = newName;
break;
}
if (item.children) {
stack.push(...item.children);
}
}
return clonedArr;
}
const updatedData = updateNestedArrayWithLodash(data, 3, 'Jackson');
console.log(JSON.stringify(updatedData, null, 2));
updateNestedArray
,遍历数组中的每个对象。id
匹配),更新其 name
属性并返回。children
属性,递归调用函数处理子数组。_.cloneDeep
深拷贝数组,避免直接修改原数组。stack
)来遍历嵌套数组。id
匹配),更新其 name
属性并退出循环。没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云