如何從嵌套物件中獲取字串陣列

如何從嵌套物件中獲取字串陣列

根據型別，需要獲取“鏈接”源物件的陣列：

const obj = {
  id: '01',
  options: {},
  children: [
    {
      id: '02',
      type: 'green',
      options: {
        link: 'http://some-page-023'
      },
      children: [
        {
          id: '03',
          type: 'black',
          options: {},
          children: [],
        },
        {
          id: '04',
          type: 'green',
          options: {
            link: 'http://some-page-044'
          },
          children: [
            {
              id: '05',
              type: 'white',
              options: {},
              children: [],
            }
          ],
        }
      ],
    },
    {
      id: '06',
      type: 'black',
      options: {
        link: 'http://some-page-258'
      },
      children: [
        {
          id: '07',
          type: 'green',
          options: {
            link: 'http://some-page-055'
          },
          children: [],
        },
        {
          id: '08',
          type: 'white',
          options: {},
          children: [
            {
              id: '09',
              type: 'green',
              options: {
                link: 'http://some-page-023'
              },
              children: [],
            }
          ],
        }
      ],
    },
  ]
}

我在做什么：

const a = []

const getLinks = (data, ltype) => {
   if (data.children) {
     for( let el in data.children) {
       if (data.children[el].type === ltype) {
         a.push(data.children[el].options.link)
       }
       getLinks(data.children[el], ltype)
     }
   }
   return a
 }

 const result = getLinks(obj, 'green')
 console.dir(result, { depth: null })

這作業正常，結果：[ 'http://some-page-023', 'http://some-page-044', 'http://some-page-055', 'http://some-第 023 頁']

但是我需要函式來回傳字串陣列（陣列應該是 init 并由函式回傳），所以我需要這樣的東西：

const getLinks = (data, ltype) => {
  const a = []
  function recursiveFind(children, ltype) {
    if (data.children) {
      for (let el in data.children) {
        if (data.children[el].type === ltype) {
          a.push(data.children[el].options.link)
        } else {
          recursiveFind(data.children[el], ltype)
        }
      }
    }
  }
  recursiveFind(data, ltype)
  return a
}

const result = getLinks(obj, 'green')
console.dir(result, { depth: null })

uj5u.com熱心網友回復：

您可以直接檢查物件并獲取鏈接并獲得嵌套結構的平面陣列。

const
    getLinks = (object, ltype) => {
        const links = [];
        if (object.type === ltype) links.push(object.options.link);
        links.push(...object.children.flatMap(o => getLinks(o, ltype)));
        return links;
    },
    obj = { id: '01', options: {}, children: [{ id: '02', type: 'green', options: { link: 'http://some-page-023' }, children: [{ id: '03', type: 'black', options: {}, children: [] }, { id: '04', type: 'green', options: { link: 'http://some-page-044' }, children: [{ id: '05', type: 'white', options: {}, children: [] }] }] }, { id: '06', type: 'black', options: { link: 'http://some-page-258' }, children: [{ id: '07', type: 'green', options: { link: 'http://some-page-055' }, children: [] }, { id: '08', type: 'white', options: {}, children: [{ id: '09', type: 'green', options: { link: 'http://some-page-023' }, children: [] }] }] }] },
    result = getLinks(obj, 'green');

console.dir(result);

一種略有不同的方法，對所需型別進行閉包。

const
    getLinks = (data, ltype) => {
        const
            gl = ({ type, options: { link }, children }) => [
                ...(type === ltype ? [link] : []),
                ...children.flatMap(gl)
            ];
        return gl(data);
    },
    obj = { id: '01', options: {}, children: [{ id: '02', type: 'green', options: { link: 'http://some-page-023' }, children: [{ id: '03', type: 'black', options: {}, children: [] }, { id: '04', type: 'green', options: { link: 'http://some-page-044' }, children: [{ id: '05', type: 'white', options: {}, children: [] }] }] }, { id: '06', type: 'black', options: { link: 'http://some-page-258' }, children: [{ id: '07', type: 'green', options: { link: 'http://some-page-055' }, children: [] }, { id: '08', type: 'white', options: {}, children: [{ id: '09', type: 'green', options: { link: 'http://some-page-023' }, children: [] }] }] }] },
    result = getLinks(obj, 'green');

console.dir(result);

uj5u.com熱心網友回復：

你的第二個片段實際上很好，你只是把引數弄錯了：

const getLinks = (data, ltype) => {
    const a = []
    
    function recursiveFind(data, ltype) {
        if (data.children) {
            for (let child of data.children) {
                if (child.type === ltype)
                    a.push(child.options.link)
                recursiveFind(child, ltype)
            }
        }
    }
    
    recursiveFind(data, ltype)
    return a
}

另請注意for..of，它比for..in.

或者，您可以擺脫臨時陣列并使用生成器：

function *getLinks (data, ltype) {
    if (data.children) {
        for (let c of data.children) {
            if (c.type === ltype)
                yield c.options.link
            yield *getLinks(c, ltype)
        }
    }
}

result = [...getLinks(obj, 'green')]

標籤：javascript数组目的递归嵌套

上一篇：C 使用函式的輸出作為函式輸入n次

下一篇：為什么生成器運算式與python3中的映射物件相比具有較低的耐力，同時重復出現，盡管有更多的pythonic？