从嵌套对象打字稿中提取子对象

Question

有没有办法从嵌套对象中提取子对象？

例如我有以下对象：

[
  {
    id: 370,
    name: 'FY 2022',
    children: [
      {
        id: 371,
        name: 'Q1 2022',
        children: [
          {
            id: 409,
            name: 'Jan 2022',
          },
          {
            id: 410,
            name: 'Feb 2022',
          },
          {
            id: 411,
            name: 'Mar 2022',
          },
        ],
      },
    ],
  },
];

如果我将函数作为参数 id 发送到 return 与该 id 对应的对象。

例如，如果我将 id = 371 作为参数提供给 return 我：

[
  {
    id: 371,
    name: 'Q1 2022',
    children: [
      {
        id: 409,
        name: 'Jan 2022',
      },
      {
        id: 410,
        name: 'Feb 2022',
      },
      {
        id: 411,
        name: 'Mar 2022',
      },
    ],
  },
];

或者如果我将 id = 410 给 return:

 [
  {
    id: 410,
    name: 'Feb 2022',
  },
];

提前致谢！

Answer 1

你可以这样做

const findById = (data, id) => {
 if(data.length === 0){
   return []
 }
 const el = data.find(d => d.id === id)
 if(el){
   return [el]
 }
 return findById(data.flatMap(d => d.children || []), id)
}


const data = [
  {
    id: 370,
    name: 'FY 2022',
    children: [
      {
        id: 371,
        name: 'Q1 2022',
        children: [
          {
            id: 409,
            name: 'Jan 2022',
          },
          {
            id: 410,
            name: 'Feb 2022',
          },
          {
            id: 411,
            name: 'Mar 2022',
          },
        ],
      },
    ],
  },
];

console.log(findById(data, 370))
console.log(findById(data, 409))
console.log(findById(data, 4090))

Answer 2

这是使用递归实现所需的一种可能解决方案 objective。

代码段

const findUsingId = (searchId, arr) => (
  [
    arr.find(({ id }) => id === searchId) ||
    findUsingId(searchId, (arr.flatMap(({ children }) => children))) ||
    -1
  ].flat()
);

const origArr = [{
  id: 370,
  name: 'FY 2022',
  children: [{
    id: 371,
    name: 'Q1 2022',
    children: [{
        id: 409,
        name: 'Jan 2022',
      },
      {
        id: 410,
        name: 'Feb 2022',
      },
      {
        id: 411,
        name: 'Mar 2022',
      },
    ],
  }, ],
}, ];

console.log('id: 371', findUsingId(371, origArr));

console.log('id: 410', findUsingId(410, origArr));

console.log('id: 370', findUsingId(370, origArr));

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

说明

首先，将可能的结果包装在数组 [] 中并应用 .flat()，这样它就不会嵌套。
检查当前数组中是否存在id
如果不是，recursive-call为当前

children

如果还没有找到，hard-coded一个-1（可以根据需要替换为"not found"）

Answer 3

您可以创建一个递归函数来处理整个对象，直到找到正确的对象。如果你想用打字稿来做，我也会创建一个接口来定义对象的结构。最终结果将是这样的：

 interface IObject = {
  id: number;
  name: string;
  children?: IObject[];
 }
 function find(yourObject: IObject[], id: number) : IObject {
  let result : IObject;
  for(const obj of yourObject){
   const {id : idObj, children} = obj;
   if(idObj === id){
    result = obj;
   }
   else if(children){
    result = find(children, id);
   }
   if(result){
    break;
   }
  }
  return result;
 }

从嵌套对象打字稿中提取子对象

Extract sub-object from nested object typescript

javascript

arrays

reactjs

typescript

nested-object