JavaScript連想配列の使い方（特に複数階層）

どうも複数階層の連想配列の理解が曖昧

JavaScriptでコーディングしていると、連想配列を使用する機会に出くわすことが多いです。最近ではJSONデータを取り扱う事も多くなりましたからね。

機会が多いという事はそれだけ扱いに慣れている、はずなのですが、なぜか毎回うろ覚えになっており、そのたびにググって使い方を再確認してはコーディングの繰り返し、であります。

「お前がちゃんと理解してないからだろ！」
と言われれば確かにその通りです、ハイ。
ですが、年齢による記憶力の衰えを40歳を過ぎてから強く感じるようになったのも事実なんです。

「これ前も同じこと検索してたよな。記憶力落ちてきたな～。」
と自分の記憶力の衰えを日々感じながら生きております。

一方で、これだけ沢山のプログラミング言語が登場し、エンジニアとしても全ての言語仕様を完璧に頭に入れるのは無理な話で、大枠だけ抑えておいて詳細はその都度確認しながらコーディングする、というのが現代では一般的なのではないでしょうか。

とは言え、同じことを毎回調べ直しているなあと感じているという事は、やっぱりちゃんと理解し記憶に定着させたほうが効率的ではあるよな、とも思うわけです。

複数階層の連想配列をLoopする例

とりあえず、今後いちいち調べ直す必要がないように、以下に複数階層を持つ連想配列の読み出し例を載せておく事にします。
個人的なメモ的意味合いが強い記事となりますが、同じように複数階層の連想配列の扱いにイマイチ自信の無い方はご参考になさってください。

食べ物(foods)の中に果物(fruits)、野菜(vegetables)があり、それぞれのキーが食材名、値が値段になっている連想配列です。

この連想配列を２段階のforEachで順に読み込み、コンソールに出力させます。

    var foods = { 
        fruits: {
            apple: "100yen", 
            banana: "300yen"
        }, 
        vegetables: 
        {
            carrot: "200yen",
            potato: "150yen"
        } 
    };
    
    console.log( "foods" );
    
    Object.keys(foods).forEach( function(value) {
     
        console.log( "-->" + value );
        
        var category = this[value];
        
        Object.keys(category).forEach( function(value) {
            
            console.log( "---->" + value + " price:" + this[value]);
        
        }, category)
     
    }, foods)

特に目新しい内容ではないのですが、毎回インターネットという大海原に網を投げるよりは、自身のブログという「生け簀」にナレッジを養殖しておいて、都合の良い時にタモですくうほうが効率的ですよね。

ブラウザのブックマークで済むのでは？という意見もありそうですが、気が付くとブックマークが膨大な数になってしまい、それを整理するのも気が失せてしまう、というのも「エンジニアあるある」かなと。

とりあえず、階層化された連想配列の読み方については、これでいちいちググらなくても良くなったので、めでたしめでたし。