ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript で再帰ループを使用して深くネストされたオブジェクト構造をトラバースする方法

JavaScript で再帰ループを使用して深くネストされたオブジェクト構造をトラバースする方法

DDD
DDDオリジナル
2024-10-22 15:04:02966ブラウズ

How to Traverse Deeply Nested Object Structures with Recursive Looping in JavaScript

JavaScript での複雑なオブジェクトの再帰ループ

あなたの目的は、JavaScript で深くネストされたオブジェクト構造を走査し、各オブジェクトの名前とそのオブジェクトにアクセスすることです。

for...in ループ

1 つのアプローチは、for...in ループを利用することです:

<code class="javascript">for (var key in foo) {
    if (key === "child") {
        // Do something with the child
    }
    else if (key === "bar") {
        // Do something with the bar
    }
    else if (key === "grand") {
        // Do something with the grand
    }
}</code>

プロトタイプ プロパティの処理

for...in を使用する場合は、プロトタイプから継承されたプロパティも反復処理されるため注意してください。これを回避するには、hasOwnProperty メソッドを使用します。

<code class="javascript">for (var key in foo) {
    if (!foo.hasOwnProperty(key)) continue;  // Skip inherited properties
    if (key === "child") {
        // Do something with the child
    }
    // ...
}</code>

再帰関数

再帰ループの場合は、再帰関数を定義することを検討してください。

<code class="javascript">function eachRecursive(obj) {
    for (var k in obj) {
        if (typeof obj[k] === "object" && obj[k] !== null) {
            eachRecursive(obj[k]);  // Recurse into sub-objects
        }
        else {
            // Do something with key-value pairs
        }
    }
}</code>

この関数はオブジェクトを走査し、ネストされたオブジェクトを再帰的にループします。

使用法

これらのソリューションを使用するには、単に呼び出します:

<code class="javascript">eachRecursive(foo);</code>

以上がJavaScript で再帰ループを使用して深くネストされたオブジェクト構造をトラバースする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。