配列の中にある連想配列の「キーの値」から「他のキーの値」を引き出したい！　「conversionData」の使い方

JavaScript

概要/やりたいこと

例えば以下のような配列。

const sampleArr = 
[{id: 1, name: 'hoge', note: '備考'},
{id: 2, name: 'huga', note:'備考2'},
{id: 3, name: 'piyo', note:'備考3'}];

この配列の中の連想配列から、任意のidのnameやnoteの値を取り出したいことってありませんか？

解決方法

const conversionData = {};
sampleArr.forEach((data) => {
  conversionData[data.id] = {
    name: data.name,
    note: data.note
  };
});

というわけではい。
このconversionDataの中身はこんな感じ。

{1: {name:"hoge",note:"備考"},
2: {name:"huga",note:"備考2"},
3: {name:"piyo",note:"備考3"}}

ここから、例えばid2のnameを引き出したいときは、

console.log(conversionData[2].name);
出力：huga

こんな感じでお好みで。
ブランケット記法のconversionDataの[]の中には変数を入れれるのが色々使えて嬉しいですね。

実用上の注意

・実際に使う場合は、頻繁に使われると思われるので、ちゃんとlibsとかのフォルダに入れてどこからでも引き出せるようにすること。
・なので、userConversionDataとか、companyConversionDataとかの命名がわかりやすい。
・conversionDataのキーは一意な値でなければちゃんと動作してくれないことに注意。
・よってconversionDataのキーを[data.name]とかにして名前でその他項目を引き出すようにするのはかなり非推奨。

ユーザー登録して、Qiitaをもっと便利に使ってみませんか。

あなたにマッチした記事をお届けします
ユーザーやタグをフォローすることで、あなたが興味を持つ技術分野の情報をまとめてキャッチアップできます
便利な情報をあとで効率的に読み返せます
気に入った記事を「ストック」することで、あとからすぐに検索できます

より詳しく

noif

@noif

@rrh816

2021-10-25 12:40

（編集済み）

リンクをコピー

このコメントを報告

findではダメでしょうか。

const sampleArr = 
[{id: 1, name: 'hoge', note: '備考'},
{id: 2, name: 'huga', note:'備考2'},
{id: 3, name: 'piyo', note:'備考3'}];

console.log( sampleArr.find(a => a.id === 2).name );
  // huga

console.log( sampleArr.find(a => a.name === 'hoge').id );
  // 1

console.log( sampleArr.find(a => a.id === 3) );
  // { id: 3, name: 'piyo', note: '備考3' }