首页 > 解决方案 > 如何从 JavaScript 中的嵌套数组中删除元素?

问题描述

假设我有一个如下所示的嵌套数组。现在我想删除元素但不删除子元素。我想让它的子元素值成为父数组/子元素值。

const steps =  [
       {
         step_id: 100,
         type: 'TEXT',
         title: null,
         item_id: 1,
         children: [
           {
             step_id: 102,
             type: 'TEXT',
             title: null,
             item_id: 1,
             children: [
               {
                 step_id: 104,
                 type: 'TEXT',
                 title: null,
                 item_id: 1,
                 children: [

                 ]
               }
             ]
           }
         ]
       }
     ];

例如,我想删除 whenstep_id=102和它的其他元素,并使它的子值对它的父子值。我想要这样的结果。

result=  steps: [
 {
   step_id: 100,
   type: 'TEXT',
   title: null,
   item_id: 1,
   children: [
     {
       step_id: 104,
       type: 'TEXT',
       title: null,
       item_id: 1,
       children: [

       ]
     }
   ]
 }
]

我尝试了下面的代码,但它没有返回正确的结果。请帮我。

谢谢你。

 const steps =  [
    {
      step_id: 100,
      type: 'TEXT',
      title: null,
      item_id: 1,
      children: [
        {
          step_id: 102,
          type: 'TEXT',
          title: null,
          item_id: 1,
          children: [
            {
              step_id: 104,
              type: 'TEXT',
              title: null,
              item_id: 1,
              children: [
                
              ]
            }
          ]
        }
      ]
    }
  ];
  
  const removeItem ={step_id: 102, type: "TEXT", title: null, item_id: 1, children: Array(0)};
  
const removeElement = (steps, removeItem) => {
    steps.forEach((step) => {
      if (step.step_id == removeItem.step_id) {
        steps = step.children;
      } else {
        removeElement(step.children, removeItem);
      }
    });

   //console.log(steps);
    return steps
  };
  
console.log(removeElement(steps, removeItem))

标签: javascriptarrays

解决方案


您只是重新分配 steps 参数变量,因此原始对象不会发生突变。
使用 splice 将找到的节点替换为其插入的子节点。

就我个人而言,我更喜欢 flatMap 和一点对象克隆。但是,如果您对原始对象的突变没问题,这很好。

const steps = [{
  step_id: 100,
  type: 'TEXT',
  title: null,
  item_id: 1,
  children: [{
    step_id: 102,
    type: 'TEXT',
    title: null,
    item_id: 1,
    children: [{
      step_id: 104,
      type: 'TEXT',
      title: null,
      item_id: 1,
      children: [

      ]
    }]
  }]
}];

const removeItem = {
  step_id: 102,
  type: "TEXT",
  title: null,
  item_id: 1,
  children: Array(0)
};

const removeElement = (steps, removeItem) => {
  steps.forEach((step, i) => {
    if (step.step_id == removeItem.step_id) {
      steps.splice(i,1,...step.children);
    } else {
      removeElement(step.children, removeItem);
    }
  });

  //console.log(steps);
  return steps
};

console.log(removeElement(steps, removeItem))


推荐阅读