連想配列のプロパティを取り出して、配列に並べ替えたい。

Question

連想配列のプロパティを取り出して並び替えを行いたいと思っています。
下記のコードのarray1 と　array2の連想配列の'name'要素だけを取り出し、

array3 = [{name:'john'},{name:'Bob'},{name:'Jen'},{name:'Mera'},]
のような形したいと思っています。
下記のコードのようにcocatメソッドを使ってしまうと、

0: {name: "john", age: 25}
1: {name: "Bob", age: 33}
2: {name: "Jen", age: 35, id: 1}
3: {name: "Mera", age: 31, id: 2}

上記のように、全ての要素が配列に入ってしまいます。
どなたかご教示いただけませんでしょうか？

const array1 = [{name:'john',age:25},{name:'Bob',age:33}];
const array2 = [{name:'Jen',age:35,id:1},{name:'Mera',age:31,id:2}];
const array3 = array1.concat(array2);
console.log(array3)

Answer 1

concatした後のarray3からmap()でnameだけを抜き出せばいけると思います。

const array1 = [{name:'john',age:25},{name:'Bob',age:33}];
const array2 = [{name:'Jen',age:35,id:1},{name:'Mera',age:31,id:2}];
const array3 = array1.concat(array2);
const array4 = array3.map((d) => {return { name : d.name } });
console.log(array4)

Comments

[takochan1192]

ありがとうございます！解決できました！！

[nekoniki]

解決して何よりです。
自分が記載したコードより、他の方の回答の方がワンライナーでスマートに書かれているので、配列操作の学習のためなら他の方のコードを参考にするとよいです。

より今風に書くならconcatするより、yambejpさんが書いたように[]で配列化した後にflat()するか、下記のようにスプレッド演算子で展開するかだと思います。
const array3 = [...array1, ...array2];

[takochan1192]

ありがとうございます。ご教示いただきまして本当に助かりました。
皆様のご回答を参考にさせていただきます。

Answer 2

mapはでてますので別解

const array3 = [array1,array2].flat().reduce((x,{name})=>(x.push({name}),x),[]);

Comments

[takochan1192]

ご回答ありがとうございます！ネストになっていた連想配列の並び替えで非常に困っておりまして、本当に助かります。flatメソッドなどは全く知りませんでした。こんな方法があるとは、、、、、、、、
驚きが隠せません。本当にありがとうございます！

Answer 3

こんにちは
concat して得られる配列に、map を使って、各要素をname のみを持つオブジェクトにすればよいかと思います。以下、その一例です。

- const array3 = array1.concat(array2);
+ const array3 = array1.concat(array2).map(({ name }) => ({ name }));

• 動作確認用 Codepen.io: jun68ykt/pen/eYZvMoX

Comments

[takochan1192]

ありがとうございます！ご丁寧にご回答いただきまして本当にありがとうございます！

[jun68ykt]

どういたしまして。解決したようで、よかったです????