私は、フロントエンドからRailsで作成したAPIにリクエストを投げて、返ってきたJSON形式のレスポンスを処理するということがよくあります。
その際、次のようにオブジェクト名.プロパティ名でレスポンスの中から欲しいデータを抽出していました。
// サンプルのレスポンスデータ
let menu = {
type: 'hamburger',
name: 'てりやきバーガー',
}
// menuのtyepが取得したい場合
console.log(menu.type) // 'hamburger'が出力される
ある時、プロパティ名に変数を使いたいことがあり「あれ、どうすればいいんだ？」と手が止まってしまったので、今回はその方法について記録しておきます。
最初に試したこと
以下の方法を試してみましたが、当然うまくいきません。
let variable = 'type'
console.log(menu.variable) // 'undefined'が出力される
変数名でプロパティにアクセスする方法
.を使わずに[]を使うことで、変数名でプロパティにアクセスすることができます。
let variable = 'type'
console.log(menu[variable]) // 'hamburger'が出力される
さいごに
わかってしまえば、ごくごく単純な話なのですが「どんなキーワードで調べるか」に少し悩みました。
私は日頃、ほぼRubyを使っているので「hash[key]みたいな感じで呼びだしたいなー」と思いつつ、それをJavaScriptでどう表現すればよいかが咄嗟に出てきませんでした。（「オブジェクト」、「プロパティ」で検索ができれば、一瞬で見つかったと思います。）
というわけで、同じようなことを考えた人がたどり着けるようなキーワードを散りばめた記事を作成してみました！