ドット表記文字列を使用してネストされた JavaScript オブジェクトのプロパティにアクセスするにはどうすればよいですか?

JavaScript でドット表記文字列を使用してネストされたオブジェクトのプロパティにアクセスする

オブジェクトを操作するとき、多くの場合、深くネストされたプロパティにアクセスする必要があります。ドット表記と括弧表記はこれを実現できますが、ネストの各レベルを個別に指定する必要があります。複雑なオブジェクトの場合、これは面倒でエラーが発生しやすくなります。

実際的な解決策は、ドット表記文字列を利用して子オブジェクトのプロパティに直接アクセスすることです。次の構造を持つオブジェクトを想像してください。

const r = { a: 1, b: { b1: 11, b2: 99 } };

ドット表記を使用して値 99 にアクセスするには、通常、次のように記述します。

r.b.b2;

ただし、変数文字列を使用したプロパティ。

const s = "b.b2";

このシナリオでは、単純なドット表記 (例: r.s) または括弧表記 (r[s]) は機能しません。

プロパティ取得用のカスタム関数

1 つの方法は、プロパティを取得するためのカスタム関数を作成することです。文字列をドット文字で区切ってプロパティに繰り返しアクセスします:

function getDescendantProp(obj, desc) {
    const arr = desc.split(".");
    while (arr.length && (obj = obj[arr.shift()]));
    return obj;
}

console.log(getDescendantProp(r, "b.b2")); // 99

この関数は、ネストされたプロパティへのアクセスを簡素化します。文字列表現を使用します。また、分割文字を適宜変更することで、配列インデックスへのアクセスを処理するように拡張することもできます。

以上がドット表記文字列を使用してネストされた JavaScript オブジェクトのプロパティにアクセスするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。