JavaScript でネストされたオブジェクトを反復処理する方法

ネストされたオブジェクトを使用した JavaScript オブジェクトの反復

JavaScript では、ドットまたは括弧表記を使用してオブジェクトのプロパティに簡単にアクセスできます。ただし、ネストされたオブジェクトを扱う場合、すべてのメンバーの反復処理はより複雑になる可能性があります。

問題ステートメント:

JavaScript オブジェクトのすべてのメンバーを効果的にループするにはどうすればよいですか? 、オブジェクト自体である値も含まれますか?たとえば、次のオブジェクトについて考えてみます。

var validation_messages = {
    "key_1": {
        "your_name": "jimmy",
        "your_msg": "hello world"
    },
    "key_2": {
        "your_name": "billy",
        "your_msg": "foo equals bar"
    }
};

目的は、このオブジェクトのすべてのプロパティを反復処理して、ネストされた各オブジェクトの "your_name" と "your_msg" にアクセスすることです。

解決策:

ネストされたオブジェクトを含む JavaScript オブジェクトをループするには、 Object.keys() メソッドとネストされた for...in ループの組み合わせ。 Object.keys() メソッドは、オブジェクトの列挙可能なすべてのプロパティ名の配列を返します。

for (var key in validation_messages) {
    // skip loop if the property is from prototype
    if (!validation_messages.hasOwnProperty(key)) continue;

    var obj = validation_messages[key];
    for (var prop in obj) {
        // skip loop if the property is from prototype
        if (!obj.hasOwnProperty(prop)) continue;

        // your code
        alert(prop + " = " + obj[prop]);
    }
}

このソリューションでは:

• 外側の for...in ループvalidation_messages オブジェクトのキーを繰り返し処理します。
• hasOwnProperty() メソッドを使用して、プロパティに直接アクセスすることのみを保証します。プロトタイプから継承されたものではなく、オブジェクトに属します。
• 各プロパティについて、対応するネストされたオブジェクトにアクセスし、内部の for...in ループでそのプロパティを反復処理します。
• ここでも、hasOwnProperty() を使用してプロトタイプのプロパティを除外します。
• 内側のループ内で、必要に応じてプロパティにアクセスして使用できます (プロパティをプロパティに表示するなど)。 alert.

このソリューションは、ネストされたオブジェクトのすべてのメンバーを効果的にループし、その値に簡単にアクセスできるようにします。

以上がJavaScript でネストされたオブジェクトを反復処理する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。