# Array.prototype.flatMap()

この記事は翻訳が完了していません。 この記事の翻訳にご協力ください

`flatMap()` メソッドは、最初にマッピング関数を使用してそれぞれの要素をマップした後、結果を新しい配列内にフラット化します。これは深さ 1 の flat が続く map と同じですが、`flatMap` はしばしば有用であり、2 つのメソッドを 1 つにマージするよりもやや効果的です。

## 構文

```var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
// return element for new_array
}[, thisArg])```

### 引数

`callback`

`currentValue`

`index`Optional

`array`Optional
`map` が呼び出された配列です。
`thisArg`Optional
`callback` を実行するときの `this` として用いられる値です。

## 説明

コールバック関数の詳細については、`Array.prototype.map()` を見てください。`flatMap` メソッドは、深さ 1 の `flat` が続く `map` と同じです。

## 例

### `map` と `flatMap`

```let arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]);
// [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]

// only one level is flattened
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]
```

While the above could have been achieved by using map itself, here is an example that better showcases the use of `flatMap`.

Let's generate a list of words from a list of sentences.

```let arr1 = ["it's Sunny in", "", "California"];

arr1.map(x => x.split(" "));
// [["it's","Sunny","in"],[""],["California"]]

arr1.flatMap(x => x.split(" "));
// ["it's","Sunny","in", "", "California"]```

Notice, the output list length can be different from the input list length.

### For adding and removing items during a `map`

`flatMap` can be used as a way to add and remove items (modify the number of items) during a `map`. In other words, it allows you to map many items to many items (by handling each input item separately), rather than always one-to-one. In this sense, it works like the opposite of filter. Simply return a 1-element array to keep the item, a multiple-element array to add items, or a 0-element array to remove the item.

```// Let's say we want to remove all the negative numbers and split the odd numbers into an even number and a 1
let a = [5, 4, -3, 20, 17, -33, -4, 18]
//       |\  \  x   |  | \   x   x   |
//      [4,1, 4,   20, 16, 1,       18]

a.flatMap( (n) =>
(n < 0) ?      [] :
(n % 2 == 0) ? [n] :
[n-1, 1]
)

// expected output: [4, 1, 4, 20, 16, 1, 18]
```
//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]

## 代替

### `reduce` と `concat`

```var arr1 = [1, 2, 3, 4];

arr1.flatMap(x => [x * 2]);
// is equivalent to
arr1.reduce((acc, x) => acc.concat([x * 2]), []);
// [2, 4, 6, 8]
```
//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]

## Polyfill

This polyfill needs Array.prototype.flat polyfill

```if (!Array.prototype.flatMap) {
Array.prototype.flatMap = function() {
return Array.prototype.map.apply(this, arguments).flat(1);
};
}
```

## 仕様

`Array.prototype.flatMap` proposal Finished (4)

## ブラウザー実装状況

Update compatibility data on GitHub
デスクトップ モバイル サーバー Chrome Edge Firefox Internet Explorer Opera Safari Android webview Android 版 Chrome Android 版 Firefox Android 版 Opera Chrome 完全対応 69 Edge 完全対応 79 Firefox 完全対応 62 IE 未対応 なし Opera 完全対応 56 Safari 完全対応 12 WebView Android 完全対応 69 Chrome Android 完全対応 69 Firefox Android 完全対応 62 Opera Android 完全対応 48 Safari iOS 完全対応 12 Samsung Internet Android 完全対応 10.0 nodejs 完全対応 11.0.0