如何从父对象列表中删除子对象javascript

Question

 <script>    var itemsTemp= [
             { id: 0, text: 'Andy' },
             {
               id: 1, text: 'Harry',
               children: [
                 { id: 2, text: 'David' }
               ]
             },
             { id: 3, text: 'Lisa' },
             { id: 4, text: 'Mona' },
             { id: 5, text: 'Ron' },
             { id: 6, text: 'Joe' }
           ];
 
   var items  = itemsTemp;
 
         var filtered = items.filter(function(item) { 
             return item.id !== 3;  
         });
 
         console.log(filtered);
 
 </script>

这样，我只能删除父对象，但如何删除子对象？请帮我解决这个问题

Answer 1

由于您想过滤孩子，您可以使用.reduce() 来执行您的数组的映射和过滤。当您到达具有children 属性的对象时，您可以递归调用您的函数，然后对子数组.reduce() 数组执行映射/过滤，如下所示：

const items = [{ id: 0, text: 'Andy' }, { id: 1, text: 'Harry', children: [{ id: 2, text: 'David' }] }, { id: 3, text: 'Lisa' }, { id: 4, text: 'Mona' }, { id: 5, text: 'Ron' }, { id: 6, text: 'Joe' } ];

const filterItems = (items, fn) => items.reduce((acc, item) => {
  if(item.children)
    return [...acc, ...filterItems(item.children, fn)];
  else if(fn(item))
     return [...acc, item];
  return acc;
}, []);

const filtered = filterItems(items, item => item.id !== 2);
console.log(filtered);

如果您不想从父列表中删除项目，而只想从子列表中删除，则改为推送更新对象：

const items = [{ id: 0, text: 'Andy' }, { id: 1, text: 'Harry', children: [{ id: 2, text: 'David' }] }, { id: 3, text: 'Lisa' }, { id: 4, text: 'Mona' }, { id: 5, text: 'Ron' }, { id: 6, text: 'Joe' } ];

const toRemoveId = 2;
const filterItems = (items, fn) => items.reduce((acc, item) => {
  if(item.children)
    return [...acc, {...item, children: filterItems(item.children, fn)}];
  else if(fn(item))
     return [...acc, item];
  return acc;
}, []);

const filtered = filterItems(items, item => item.id !== 2);
console.log(filtered);

这适用于任意物体深度。

Answer 2

我刚刚编写了 filterById 函数，我认为它适用于您的情况

var itemsTemp = [
  { id: 0, text: "Andy" },
  {
    id: 1,
    text: "Harry",
    children: [{ id: 2, text: "David" }],
  },
  { id: 3, text: "Lisa" },
  { id: 4, text: "Mona" },
  { id: 5, text: "Ron" },
  { id: 6, text: "Joe" },
];

var items = itemsTemp;

const filterById = (items, id) => {
    return items.reduce((accumulator, currentValue) => {
        if(currentValue.children){
          const newCurrentValue = filterById(currentValue.children, id)
          currentValue = {...currentValue, children: newCurrentValue}
        }
        if(currentValue.id !== id){
          return [...accumulator, currentValue]
        }
        return accumulator
    },[])
}

console.log(filterById(itemsTemp,2));
console.log(itemsTemp)

Answer 3

我认为你可以这样做。

   var itemsTemp= [
             { id: 0, text: 'Andy' },
             {
               id: 1, text: 'Harry',
               children: [
                 { id: 2, text: 'David' }
               ]
             },
             { id: 3, text: 'Lisa' },
             { id: 4, text: 'Mona' },
             { id: 5, text: 'Ron' },
             { id: 6, text: 'Joe' }
           ]; 
        var items  = itemsTemp; 
        var filtered = items.filter(function(item) {             
             childrens=item.children;            
             if(childrens)
             {
              filteredchildren = childrens.filter(children=>children.id!==2);
              item.children=filteredchildren;
             }
            
             return item.id !== 2;
         });
         console.log(filtered);