オブジェクトの奥深くのプロパティ値を取得するサンプルコード！Javascriptの勉強

Javascriptで複雑なオブジェクトがあるとその中の一つの値を取得したい時に、何回かの手数を踏んでようやく取得できるような状態なのでサンプルコードを備忘録として残します。

オブジェクトのプロパティ値とは

オブジェクトに結びつけられたプロパティに指定されている値です。

let test_obj = {
    name: “Nakamoto”    // nameのプロパティ値は Nakamoto
};

プロパティ値 取得構文

取得するには以下の構文を使用します。

オブジェクト名.プロパティ名

[ ]で囲んだ取得方法もあります。

オブジェクト名[‘プロパティ名’]

個人的にはドットを使う方式をよく見かけます。

プロパティ値を取得するサンプルコード

簡単なものからやや複雑なものまでプロパティ値を取得してみます。せっかくなので全てドットで書く方法と、[]を取り入れて書く方法どちらも書きました。

オブジェクトの中のプロパティ値を取得する

let test_obj = {
    name: “Nakamoto” 
};
console.log(test_obj.name); // Nakamoto
console.log(test_obj[‘name’]); // Nakanoto

オブジェクトの中のオブジェクトのプロパティ値を取得する

let test_obj = {
    name: “programmer-life”,
    objData1: {
        season: “summer”,
        temperature: “34℃”
   }
};
console.log(test_obj.objData1.season); // summer
console.log(test_obj.objData1[‘season’]); // summer

オブジェクト(1階層)の中のオブジェクト(2階層)の中のオブジェクト(3階層)の中の配列の値を取得する

let test_obj = {
    name: “programmer-life”,
    objData1: {
        season: “summer”,
        temperature: “34℃”,
        obj:{
            rainy:false,
            humidity:[0, 20, 40, 60]
        }
    }
};
console.log(test_obj.objData1.obj.humidity[3]); // 60
console.log(test_obj.objData1.obj[‘humidity’][3]); // 60

おわり

やっていることは簡単なのに、いざ大量のデータを前にすると考えが止まってしまったりする。冷静に対応しないといけないですね。
階層が深くなっていくと値を取得するコードが長くなってしまうから、そんなときは[]を使う書き方もプロパティ名がわかりやすくていいのかなと思いました。