ホームページ > ウェブフロントエンド > jsチュートリアル > 入れ子になった JavaScript オブジェクトを走査する方法: 再帰的か非再帰的か?

入れ子になった JavaScript オブジェクトを走査する方法: 再帰的か非再帰的か?

Susan Sarandon
リリース: 2024-11-02 05:14:02
オリジナル
938 人が閲覧しました

How to Traverse Nested JavaScript Objects: Recursive vs. Non-Recursive?

ネストされた 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: []
    }
  ]
};
ログイン後にコピー

非再帰的アプローチ

(2023 年に導入)

非再帰的アプローチでは、スタックを利用してオブジェクトを走査できます:

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' && currentObj[key] !== null) {
        stack.push(currentObj[key]);
      }
    });
  }
};
ログイン後にコピー

再帰的アプローチ

深い反復を提供する再帰的アプローチの場合、Object.keys():

const iterate = (obj) => {
  Object.keys(obj).forEach(key => {
    console.log(`key: ${key}, value: ${obj[key]}`);

    if (typeof obj[key] === 'object' && obj[key] !== null) {
      iterate(obj[key]);
    }
  });
};
ログイン後にコピー

どちらのアプローチも、ネストされた JavaScript を走査する効率的な手段を提供します。オブジェクト。非再帰的アプローチを選択するか再帰的アプローチを選択するかは、特定の要件と好みによって異なります。

以上が入れ子になった JavaScript オブジェクトを走査する方法: 再帰的か非再帰的か?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート