Javascript-从嵌套对象数组中删除对象

如何解决Javascript-从嵌套对象数组中删除对象

我有一个嵌套的Object数组，我想从该嵌套数组中删除一个项目，但是由于某种原因，这似乎不适用于我的方法：

对象

export const completeNavigationItemsV2Response = [
    {
        id: 'Erlebniskategorien',title: 'Erlebniskategorien',uri: '/on/demandware.store/Sites-JSShop-Site/default/SearchJS-Show',children: [
            {
                id: 'fliegen-fallen',title: 'Fallen & Springen',uri: '/fliegen-fallen/fallen-springen,default,sc.html',children: [
                    {
                        id: 'fallen-springen',children: [],}
                ],},{
                id: 'Weit-Weg',title: 'Reisen & Kurzurlaub',uri: '/reisen/Weit-Weg,children: [
                    {
                        id: 'staedtereisen',title: 'Städtereisen',uri: '/reisen/staedtereisen,{
                id: 'motorpower',title: 'Motorpower',uri: '/geschenke-maenner/motorpower,children: [
                    {
                        id: 'rennwagen',title: 'Rennwagen',uri: '/motorpower/rennwagen,{
                id: '10',title: 'Erlebnisse mit Stars',uri: '/erlebnisse-mit-stars/l/10',children: [
                    {          // <== remove this object with id === 'glossar'
                        id: 'glossar',title: 'Glossar',uri: '/erlebnisstandorte/glossar,pg.html',],}
];

你们中的某人现在会以一种便捷的es6方法，如何以某种动态的方式（例如，使用.map()或.filter()函数从整个对象中删除该子对象吗？

解决方法

如果要在对象的任何级别使用它，则可以使用如下递归函数来完成它：

// Object is the same,just minified
const completeNavigationItemsV2Response=[{id:"Erlebniskategorien",title:"Erlebniskategorien",uri:"/on/demandware.store/Sites-JSShop-Site/default/SearchJS-Show",children:[{id:"fliegen-fallen",title:"Fallen & Springen",uri:"/fliegen-fallen/fallen-springen,default,sc.html",children:[{id:"fallen-springen",children:[]}]},{id:"Weit-Weg",title:"Reisen & Kurzurlaub",uri:"/reisen/Weit-Weg,children:[{id:"staedtereisen",title:"Städtereisen",uri:"/reisen/staedtereisen,{id:"motorpower",title:"Motorpower",uri:"/geschenke-maenner/motorpower,children:[{id:"rennwagen",title:"Rennwagen",uri:"/motorpower/rennwagen,{id:"10",title:"Erlebnisse mit Stars",uri:"/erlebnisse-mit-stars/l/10",children:[{id:"glossar",title:"Glossar",uri:"/erlebnisstandorte/glossar,pg.html",children:[]}]}]}];


const removeItemWithId = (array,id) => {
  return array
    .filter(obj => obj.id !== id) // filter out if the id matches
    .map(obj => ({ // Do the same for children (if they exist)
      ...obj,children: obj.children !== undefined 
                              ? removeItemWithId(obj.children,id) 
                              : undefined
    }));
};

console.log(removeItemWithId(completeNavigationItemsV2Response,'glossar'));

,

尽管比ES6更新，但如果可以支持.flatMap()，则可以通过在初始数组上调用.flatMap()然后在子数组上调用它来递归地执行此操作。如果到达要删除的元素，则可以返回一个空数组[]，该数组在连接到结果数组中时将删除该对象。

const arr = [{ id: 'Erlebniskategorien',title: 'Erlebniskategorien',uri: '/on/demandware.store/Sites-JSShop-Site/default/SearchJS-Show',children: [{ id: 'fliegen-fallen',title: 'Fallen & Springen',uri: '/fliegen-fallen/fallen-springen,sc.html',children: [{ id: 'fallen-springen',children: [],}],},{ id: 'Weit-Weg',title: 'Reisen & Kurzurlaub',uri: '/reisen/Weit-Weg,children: [{ id: 'staedtereisen',title: 'Städtereisen',uri: '/reisen/staedtereisen,{ id: 'motorpower',title: 'Motorpower',uri: '/geschenke-maenner/motorpower,children: [{ id: 'rennwagen',title: 'Rennwagen',uri: '/motorpower/rennwagen,{ id: '10',title: 'Erlebnisse mit Stars',uri: '/erlebnisse-mit-stars/l/10',children: [{ id: 'glossar',title: 'Glossar',uri: '/erlebnisstandorte/glossar,pg.html',],}];

const removeId = "glossar";
const res = arr.flatMap(function fn(o) {
  return o.id !== removeId ? ({...o,children: o.children.flatMap(fn)}) : [];
});

console.log(res);