根據輸入值過濾未知的深層嵌套數組

Question

首先，如果這個問題已經得到回答，我必須說對不起，但我還沒有找到我正在尋找的答案:(

我有一個嵌套深度未知的對象數組（可以是 20-30 甚至更多），我想根據輸入字段值過濾它的“名稱”屬性。

public nestedArray = [
  {id: 1, name: 'Example_1', children: []},
  {id: 2, name: 'Test', children: []},
  {id: 3, name: 'Test Name', children: [
    {id: 10, name: 'Child name', children: [
      {id: 20, name: 'Example_14', children: []},
      {id: 30, name: 'Last Child', children: []}
        ]
      }
    ]
  }
];

我想要接收的結果是一個對象數組，其中只有一個級別的“名稱”字段，其中包含輸入值。 例如我的輸入值是'am'，所以結果是：

resultsArray = [
  {id: 1, name: 'Example_1'},
  {id: 3, name: 'Test Name'},
  {id: 10, name: 'Child name'},
  {id: 20, name: 'Example_14'}
];

像這樣在第一級做到這一點沒有問題：

public filter(array: any[], input_value: string): void {
  array = array.filter(el => {
    return el.name.toLowerCase().includes(input_value.toLowerCase()));
  }
}

提前致謝！

Answer 1

您可以 map 數組及其子元素，並獲取字符串與name屬性匹配的對象的平面結果。

 const find = value => ({ children, ...o }) => [...(o.name.includes(value)? [o]: []), ...children.flatMap(find(value)) ], data = [{ id: 1, name: 'Example_1', children: [] }, { id: 2, name: 'Test', children: [] }, { id: 3, name: 'Test Name', children: [{ id: 10, name: 'Child name', children: [{ id: 20, name: 'Example_14', children: [] }, { id: 30, name: 'Last Child', children: [] }] }] }], result = data.flatMap(find('am')); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }

另一種具有單個結果數組和經典方法的解決方案。

 const find = (array, value) => { const iter = array => { for (const { children, ...o } of array) { if (o.name.includes(value)) result.push(o); iter(children); } }, result = []; iter(array); return result; }, data = [{ id: 1, name: 'Example_1', children: [] }, { id: 2, name: 'Test', children: [] }, { id: 3, name: 'Test Name', children: [{ id: 10, name: 'Child name', children: [{ id: 20, name: 'Example_14', children: [] }, { id: 30, name: 'Last Child', children: [] }] }] }], result = find(data, 'am'); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }