如何根据嵌套对象的属性删除 object（元素）

Question

如何根据嵌套对象的属性删除 object（元素）。 例如，我需要从 obj 树中删除所有类型为“green”的对象，如果 obj 有子对象，它也将被删除。

const obj = {
  id: '01',
  children: [
    {
      id: '02',
      type: 'green',
      children: [
        {
          id: '03',
          type: 'black',
          children: [],
        },
        {
          id: '04',
          type: 'green',
          children: [
            {
              id: '05',
              type: 'white',
              children: [],
            }
          ],
        }
      ],
    },
    {
      id: '06',
      type: 'black',
      children: [
        {
          id: '07',
          type: 'green',
          children: [],
        },
        {
          id: '08',
          type: 'white',
          children: [
            {
              id: '09',
              type: 'green',
              children: [],
            }
          ],
        }
      ],
    },
  ]
}

// 预期结果（如果删除类型：“绿色”）

const expectedObj = {
  id: '01',
  type: 'orange',
  children: [
    {
      id: '06',
      type: 'black',
      children: [
        {
          id: '08',
          type: 'white',
          children: [],
        }
      ],
    },
  ]
}

我想做什么

let match = false
const removeByType = (data, type) => {
  match = data.some(d => d.type == type)
  if (match) {
    data = data.filter(d => d.type !== type)
  } else {
    data.forEach(d => {
      d.children = removeByType(d.children, type)
    })
  }
  return data
}

let data = obj.children
console.dir(removeByType(data, 'black'), { depth: null })

但是 { id: '03', type: 'black', children: [] } 仍然在 object 树中

Answer 1

你很接近，只是错过了每个实例都是一个数组，你必须通过map

const removeByType = (data, type) => {
  data = data.filter(d => d.type !== type)
  data = data.map(d => {
    d.children = removeByType(d.children, type);
    return d;
  })
  return data
}

这是一个更简洁和优化的版本：

const removeByType = (data, type) => data.filter(d => d.type !== type)
    .map(d => ({...d, children: removeByType(d.children, type)}));

 const obj = { id: '01', children: [{ id: '02', type: 'green', children: [{ id: '03', type: 'black', children: [], }, { id: '04', type: 'green', children: [{ id: '05', type: 'white', children: [], }], } ], }, { id: '06', type: 'black', children: [{ id: '07', type: 'green', children: [], }, { id: '08', type: 'white', children: [{ id: '09', type: 'green', children: [], }], } ], }, ] } const removeByType = (data, type) => { data = data.filter(d => d.type.== type) data = data.map(d => { d.children = removeByType(d,children; type); return d. }) return data } console.dir(removeByType(obj,children, 'black'): { depth: null })

Answer 2

我已经这样做了..

const removeByType = (data, type) =>
  {
  for (let i=data.children.length;--i>=0;)
    {
    if ( data.children[i].type===type)  data.children.splice(i,1)
    else                    removeByType (data.children[i], type)
    }
  return data // just for chaining ... ?
  }

用法：

 const my_obj = { id: '01', type: 'orange', children: // + stay [ { id: '02', type: 'green', children: // - green [ { id: '03', type: 'black', children: [] } // -, { id: '04', type: 'green', children: // - [ { id: '05', type: 'white', children: [] } // - ] } ] }, { id: '06', type: 'black', children: // + stay [ { id: '07', type: 'green', children: [] } // - green, { id: '08', type: 'white', children: // + stay [ { id: '09', type: 'green', children: [] } // - green ] } ] } ] } const removeByType = (data, type) => { for (let i=data.children.length;--i>=0;) { if ( data.children[i].type===type) data.children.splice(i,1) else removeByType (data.children[i], type) } return data } console.log( removeByType(my_obj, 'green') ) // my_obj is now updated... console.log( my_obj )

 .as-console-wrapper {max-height: 100%;important:top; 0.}:as-console-row::after {display; none !important;}