mapで配列を返したい

Question

#やりたい事

const list = [
  ['aaa','bbb','ccc'],
  ['aaa','bbb','ccc'],
  ['aaa','bbb','ccc'],
]
const hoge = list.map((item)=>{
  return item
})
hoge // ['aaa','bbb','ccc','aaa','bbb','ccc','aaa','bbb','ccc']としたい。

二次元配列の変数をmapを使用して、一般的に配列を出力したいです。
必ずmapを使用して行いたいのですが、どのように処理すれば二次元配列ではなく、一般的な配列で出力出来ますか？

Comments

[maisumakun]

「必ずmapを使用して行いたい」のはなぜでしょうか？

（mapはコードに入っているけど、それが「全く同じ内容の配列を返す、ほぼ無意味な操作」であっても問題ないのでしょうか？）

Answer 1

map で実装を考えることが間違いです。

const hoge = list.flat();
console.log(hoge);
// ["aaa", "bbb", "ccc", "aaa", "bbb", "ccc", "aaa", "bbb", "ccc"]

map を使う場合、forEach と同じ使い方になり、返却値が無意味になってしまいます。

const hoge2 = []
for ( ary of list ) { hoge2.push(...ary) };
console.log( hoge2 );

const hoge3 = []
list.forEach( ary => hoge3.push(...ary) );
console.log( hoge3 );

const hoge4 = []
list.map( ary => hoge4.push(...ary) );
console.log( hoge4 );

Answer 2

flat一択でしょうけど、配列をいじくりまわしたならreduceでもできます

const hoge=list.reduce((x,y)=>(x.push(...y),x));

よく考えたらこれでも

const hoge=[].concat(...list);

Comments

[AkitoshiManabe]

reduce は色々弄れますね。スプレッド構文を用いてpushする箇所を古典な concat にしたパターン
const hoge = list.reduce((x,y)=>x.concat(y),[]);

[yambejp]

いろいろ考えたんですがmapが必要になるケースが考えつかないですね・・・

Answer 3

先にflat()を使ってからmapを使うのはどうですか？
※この場合mapを使う意味がありませんが、「必ずmapを使用して行いたい」とのことなので・・・

const list = [
  ['aaa','bbb','ccc'],
  ['aaa','bbb','ccc'],
  ['aaa','bbb','ccc'],
]
const hoge = list.flat().map((item)=>{
  return item
})
console.log(hoge);
// -> ["aaa", "bbb", "ccc", "aaa", "bbb", "ccc", "aaa", "bbb", "ccc"]