我有一个递归函数,它通过 id 删除一个项目,如果这个项目嵌套在一个 children 数组中,它会将它向上移动一个级别,它基本上是一种菜单结构。当一个项目被删除时, children 不会被扔掉,而是留在原来的对象中。
现在这需要一个“数据”参数并对其进行操作,但是
我想知道是否有可能将它转换为一个返回全新数组的函数,并保持参数不可变?
这是功能
function removeId(data, id, parent = null) {
data.forEach((o, i) => {
if (o.id && o.id === id) {
if (parent) {
o.children.forEach(c => parent.children.push(c));
}
data.splice(i, 1);
return true;
} else if (o.children) {
removeId(o.children, id, o);
}
});
}
这是使用的测试数据
const data = [
{
id: 2,
children: [
{
id: 1,
children: []
}
]
},
{
id: 3,
children: [],
}
]
该函数是这样调用的
data = removeId(data, itemIdToDelete)
预期的输出是一个新的(不可变的)数组,具有前一个结构的数组,除了删除的项目(嵌套)
这是运行该方法并传递要删除的 2 的 id 后的预期输出
const data = [
{
id: 1,
children: []
},
{
id: 3,
children: [],
}
]
我试过了
编辑:这不仅仅是一个简单的深度克隆问题,还涉及逻辑,例如检查 parent 是否有 child 。
最佳答案
您可以使用 reduce
方法执行此操作,并在每个递归级别上创建新数组。
const data = [{"id":2,"children":[{"id":1,"children":[]}]},{"id":3,"children":[]}]
function removeId(data, id) {
return data.reduce((r, e) => {
// create shallow copy of the current object
const o = Object.assign({}, e);
// if object has children property
// create nested copy of children with recursive call
// where data param will now be children of the current element
if(e.children) {
o.children = removeId(e.children, id);
}
// if id of the current element is equal to target id
// push(spread) its children to current accumulator - r
// that will depend of the current recursion level
// else just push current object shallow copy - o
if (id == e.id) {
r.push(...o.children)
} else {
r.push(o)
}
// return accumulator
return r;
}, [])
}
console.log(removeId(data, 1))
console.log(removeId(data, 3))
console.log(removeId(data, 2))
关于javascript - 使递归函数不可变?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55353676/