array.mapにもう一度array.map

Question

###実現したいこと
対象のオブジェクトから、ほしい結果を得たいです。宜しくお願い致します。

###対象のオブジェクト

var obj = {
	google: [ 'a', 'b' ],
	amazon: [ 'c', 'd' ],
}

ほしい結果

kinds = [ 'a', 'b', 'c', 'd' ];

###試したコード
まず以下でできませんでした。

var kinds = Object.values(obj).map(array=>array.map(value=>value));
console.log(kinds); 

試しに簡易なものとしてarray.mapを一回で試すと、確かにobjの中が取れました。

var array = Object.values(obj).map(array=>array); // objの中が取れました

ならば二回試してこれならできるという理屈のつもりだったのですが、どうすべきだったのでしょうか？

var kinds = Object.values(obj).map(array=>array.map(value=>value));

もちろんforEeachなら確実ですが、一行でスパッとかける方法で探しています。
jQueryでも構いません。

Answer 1

二回試してこれならできるという理屈のつもりだったのですが

いえ、array=>array.map(value=>value)はもとの配列と全く同じ要素の配列を返しますので、状況は何も変わりません。

存在すればArray.prototype.flatMap（MDN）が最適解だと思いますが、古いブラウザに対応するにはreduceなどで書く必要があります。

var kinds = Object.values(obj).reduce((arr, current) => arr.concat(current), []);

Comments

[kaminarikun]

最新から古い方までありがとうございます。お早いご回答助かりました。

[rhiroe]

純jsでも展開使えるなら使った方が簡潔に書けそうですね。
ver kinds = [].concat(...Object.values(obj))

Answer 2

jQuery使うならこんな感じ

ver kinds = $.merge(...Object.values(obj));

Comments

[kaminarikun]

美しいですね。ありがとうございます。