複数の配列を使用して連想配列に作り替える方法

Question

複数の配列を使用して連想配列(オブジェクト)に作り替える方法が知りたいです。

■現状の状態
var a = ["高橋","鈴木","佐藤"]
var b = ["30才","31才","32才"]
var c = ["京都","大阪","奈良"]

■変更したい形
[
{name: "高橋", age: "30才", area: "京都"},
{name: "鈴木", age: "31才", area: "大阪"},
{name: "佐藤", age: "32才", area: "奈良"}
]

おそらく、各配列から一つずつ取り出しループ処理していけば大丈夫そうな気しますが、
上記の場合のコードの記載方法がわかりません。調べてもconcatとかの配列の結合などしか確認ができませんでした。

Answer 1

こんにちは

オブジェクトや配列の操作で便利なライブラリ、lodash を使うと以下で得られます。

var result = _.zip(a, b, c).map(values => 
               _.zipObject(["name", "age", "area"], values))

• 動作確認用CodePen: https://codepen.io/jun68ykt/pen/pojXXOZ?editors=0012

追記

以下のようにすれば、_.zipObject は使わなくても済みました。

var result = _.zip(a, b, c).map(([name, age, area]) => ({ name, age, area }))

• 動作確認用CodePen: https://codepen.io/jun68ykt/pen/BaogXyY?editors=0012

Comments

[tomato01]

ご回答を頂き誠にありがとうございます！こんなに便利なライブラリがあるのですね。とても勉強になりました。自分でも調べて見るようにします。ありがとうございました！

[jun68ykt]

どういたしまして????
> とても勉強になりました。
とのことでよかったです。
lodash 、便利です。メソッドがたくさん用意されていますので、ドキュメントをざっと見て、「これが一番便利そう」と思ったものから一つずつ、自分のものにしていかれるとよいかと思います。

[tomato01]

ご回答の件、どうもありがとうございました！
ほぼJS初心者なんでまだ効率が良い書きかたなどもわからないのですが、lodashはとても便利そうとのことなのでしっかり勉強をしてみるようにします。

Answer 2

単純にfor文でループ回して代入すれば良いのではないでしょうか？

var a =  ["高橋","鈴木","佐藤"]
var b =  ["30才","31才","32才"]
var c =  ["京都","大阪","奈良"] 
const ary = [];

for (let i = 0; i < a.length; i++) {
    ary[i] = {};
    ary[i].name = a[i];
    ary[i].age = b[i];
    ary[i].area = c[i];
}
console.log(ary);

Comments

[tomato01]

ご回答を頂き誠にありがとうございます！forで回す場合はこうやってやるのですね。とても勉強になりました。ありがとうございました！