javascript - 使用reduce对对象数组进行递归循环
问题描述
我有一系列有孩子的对象。目标是从项目数组中删除每个项目。
是否可以不使用 forEach 和 map 循环?在这种情况下如何使用reduce?
问题是一些数组在一层上有项目,而另一些数组在里面有项目的子数组。样品在这里:
{
"label": "child1",
"children": [
{
"label": "child2",
"items": [
"item1",
"item2"
]
},
{
"label": "child3",
"items": [
"item1",
"item2",
"item3"
]
}
]
}
结果,我想看到一个带有空项目数组的对象数组。这是一个要变异的对象:
[
{
"label": "parent",
"children": [
{
"label": "child1",
"children": [
{
"label": "child2",
"items": [
"item1",
"item2"
]
},
{
"label": "child3",
"items": [
"item1",
"item2",
"item3"
]
}
]
},
{
"label": "child4",
"items": []
},
{
"label": "child5",
"items": ["item1","item2"]
}
]
}
]
这是我不完整的解决方案:
function flattenDeep(arr) {
return arr.reduce(
(acc, val) =>
Array.isArray(val)
? acc.concat(flattenDeep(val.children))
: acc.concat(val.children),
[]
);
}
解决方案
这是一种清空所有items
数组的方法。
这个想法是使用可以递归使用的预定义reducer方法。
const reducer = (reduced, element) => {
// empty items array
if (element.items) {
element.items.length = 0;
}
// if element has children, recursively empty items array from it
if (element.children) {
element.children = element.children.reduce(reducer, []);
}
return reduced.concat(element); // or: [...reduced, element]
};
document.querySelector("pre").textContent =
JSON.stringify(getObj().reduce(reducer, []), null, " ");
// to keep relevant code on top of the snippet
function getObj() {
return [
{
"label": "parent",
"children": [
{
"label": "child1",
"children": [
{
"label": "child2",
"items": [
"item1",
"item2"
]
},
{
"label": "child3",
"items": [
"item1",
"item2",
"item3"
]
}
]
},
{
"label": "child4",
"items": []
},
{
"label": "child5",
"items": ["item1","item2"]
}
]
}
];
}
<pre></pre>
推荐阅读
- python - 如何计算python中字符串中的空格和符号?
- kubernetes - k8s服务的外网IP和Ingress有什么区别
- python - 如何匹配熊猫系列中文本列中的单词或字符?
- flutter - 如何将句号“.”后第一个单词的TextField值首字母大写?
- f# - F# 的 MIME 类型是什么?
- node.js - 如何停止从主进程到子进程的信号传播?
- python - 具有日期时间和散点图交互的绘图破折号范围滑块
- material-ui - Material UI - 添加“今天”按钮到
- python - Python Json to csv, 提取指定键,KeyError:
- performance - 如何说明连接速度的瓶颈