【JavaScript】Object.keysとforEachを使ったプロパティ取得
オブジェクトのプロパティを取得する方法をまとめました。
手順は2つ。
・Object.keysを使い、プロパティと値を取得
・forEachを使い、それぞれを表示
キャラクターの座標情報を格納する定数characterPositionがあったとして
const characterPosition = {
x: 100,
y: 200,
z: 9
};
定数keysにプロパティ(x,y,z)と値を格納、出力します。
const keys = Object.keys(characterPosition);
keys.forEach(key => {
console.log(`Key:${key} Value: ${characterPosition[key]}`);//テンプレートリテラル
});
console.logの結果は次の通りになりました。
Key:x Value: 100
Key:y Value: 200
Key:z Value: 9
追記:Object.entries()を使い更に短く
Object.entries(characterPosition).forEach(([key,value])=>{
console.log(`Key:${key} Value: ${value}`);
});
・Object.keysはkeysを使いまわして返す
・Object.entriesはオブジェクトのエントリ(=中身)を組で返す
1個ずつ渡すか、グループで渡すかの違いと理解した。
参考
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
謝辞:@Mihiraghi様
ありがとうございました。