JavaScriptを書いていて、「オブジェクトからキーの一覧を取得したい」って言う場面があり、そんな時にちょうど良い方法があったので紹介する。
Object.keys()メソッド:オブジェクトからキーの一覧を取得する
結論から言うと、JavaScriptでは、
Object.keys()メソッドを使うことで、オブジェクトからキーの一覧を取得することが可能である。
Object.keys()メソッドの使い方
Object.keys()メソッドを使って、オブジェクトからキーの一覧を取得するには、
- Object.keys()メソッドの引数にオブジェクトを指定する。
- この時、戻り値は、取得したキーの配列になる。
# Object.keys()メソッドの使い方
var キーの配列 = Object.keys(オブジェクト);
Object.keys()メソッドでオブジェクトのキーの一覧を取得するサンプル
では実際にObject.keys()メソッドを使って、
オブジェクトからキーの一覧を取得するサンプルを紹介していく。
以下のようなJavaScriptのオブジェクトがあるとする。
var obj = {
タピオカ: {
分類: 'デザート',
主成分: '糖分'
},
牛丼: {
分類: '和食',
主成分: '炭水化物'
},
ビッグマック: {
分類: 'ファストフード',
主成分: '脂質'
}
};
最上位層のキーである、「タピオカ」「牛丼」「ビッグマック」の一覧を、
Object.keys()メソッドを使用して取得するには、以下のようにしてやれば良い。
Object.keys(obj);
結果をコンソールに出して確認してみる。
Object.keys()メソッドの結果として、キーの一覧である「タピオカ」「牛丼」「ビッグマック」が、配列として取得できていることが確認できるだろう。
このように、Object.Keys()メソッドを使用すれば、
引数にオブジェクトを指定するだけで簡単にオブジェクトのキーの一覧を取得することが可能だ。
また、覚えておいて欲しい点として、
戻り値のキーの一覧は配列のため、キーの一覧を利用してfor文やforeach文を実行すると言ったことも可能だ(実際に筆者はこの方法を多用している)。
参考:JavaScriptでJsonをオブジェクトとして読み込む方法
参考までに、JavaScriptのオブジェクト関連の記事として、
JavaScriptでJsonをオブジェクトとして読み込み・書き込みする方法を下記の記事にて紹介している。
JavaScriptでオブジェクトを扱ってこの記事にたどり着いたと言うことは、多分jsonファイルも精通している方、もしくは勉強中の方だと思うので、ぜひ参考までに読んでもらいたい。