如何迭代嵌套的 JavaScript 物件？-js教程-PHP中文網

如何迭代嵌套的 JavaScript 物件？

Mary-Kate Olsen

發布： 2024-11-03 05:24:31

原創

707 人瀏覽過

How Can You Iterate Through Nested JavaScript Objects?

迭代嵌套的JavaScript 物件

迭代嵌套的JavaScript 物件可能具有挑戰性，特別是當您需要檢索由具體的財產價值。考慮下面的範例：

var cars = {
  label: 'Autos',
  subs: [
    {
      label: 'SUVs',
      subs: []
    },
    {
      label: 'Trucks',
      subs: [
        {
          label: '2 Wheel Drive',
          subs: []
        },
        {
          label: '4 Wheel Drive',
          subs: [
            {
              label: 'Ford',
              subs: []
            },
            {
              label: 'Chevrolet',
              subs: []
            }
          ]
        }
      ]
    },
    {
      label: 'Sedan',
      subs: []
    }
  ]
};

登入後複製

遞歸迭代方法：

要深入遍歷物件層次結構，您可以使用遞歸方法：

const iterate = (obj) => {
    Object.keys(obj).forEach(key => {

    console.log(`key: ${key}, value: ${obj[key]}`)

    if (typeof obj[key] === 'object' &amp;&amp; obj[key] !== null) {
            iterate(obj[key])
        }
    })
}

登入後複製

此函數遞歸地迭代對象，列印每個層級的鍵值對。如果遇到的屬性包含另一個對象，則函數以該對像作為參數呼叫自身。

非遞歸迭代方法：

另一種非遞歸方法涉及使用堆疊資料結構：

const iterate = (obj) => {
    const stack = [obj];
    while (stack?.length > 0) {
        const currentObj = stack.pop();
        Object.keys(currentObj).forEach(key => {
            console.log(`key: ${key}, value: ${currentObj[key]}`);
            if (typeof currentObj[key] === 'object' &amp;&amp; currentObj[key] !== null) {
                stack.push(currentObj[key]);
            }
        });
    }
};

登入後複製

此函數利用堆疊迭代物件層次結構。它從堆疊中彈出最後一個元素並迭代其屬性。如果屬性保存一個對象，它會將該對象推送到堆疊上以進行進一步迭代。

以上是如何迭代嵌套的 JavaScript 物件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！