Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Метод flatMap() сначала применяет функцию к каждому элементу, а затем преобразует полученый результат в плоскую структуру и помещает в новый массив. Это идентично map фукнции, с последующим применением функции flat с параметром depth ( глубина ) равным 1, но flatMap часто бывает полезным, так как работает немного более эффективно.

Синтаксис

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // возращает элемент для new_array
}[, thisArg])

Параметры

callback
Функция которая производит элементы нового массива, принимает три аргумента:
 
currentValue
Текущий обрабатываемый элемент массива.
indexНеобязательный
Индекс обрабатываемого элемента в массиве.
arrayНеобязательный
Массив по которому осуществляется обход.
thisArgНеобязательный
Значение используемое в качестве this при вызове функции callback.

Возвращаемое значение

Новый массив, каждый элемент которого является результатом выполнения функции callback и "поднят" на уровень 1.

Описание

Смотрите Array.prototype.map() для детального описания callback функции. Метод flatMap идентичен методу map с последующим вызовом flat с параметром depth 1.

Примеры

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]

// выравнивается только один уровень
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]

Хотя результат полученый в примере выше можно было получить используя просто map, ниже мы рассмотрим пример где flatMap является более эффективным.

Давайте сгенерируем список слов из списка предложений.

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"]

Обратите внимание, длина списка вывода может отличаться от длины списка ввода.

//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]

Альтернативное решение

reduce and 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]

Спецификация

Спецификация Статус Комментарий
заявка Array.prototype.flatMap Кандидат (3)  

Поддержка браузерами

Update compatibility data on GitHub
КомпьютерыМобильныеServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidEdge MobileFirefox для AndroidOpera для AndroidSafari on iOSSamsung InternetNode.js
flatMapChrome Полная поддержка 69Edge Нет поддержки НетFirefox Полная поддержка 62IE Нет поддержки НетOpera Полная поддержка 56Safari Полная поддержка 12WebView Android Полная поддержка 69Chrome Android Полная поддержка 69Edge Mobile Нет поддержки НетFirefox Android Полная поддержка 62Opera Android Полная поддержка 56Safari iOS Полная поддержка 12Samsung Internet Android Нет поддержки Нетnodejs Полная поддержка 11.0.0

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки

См так же:

Метки документа и участники

Внесли вклад в эту страницу: mdnwebdocs-bot, taxidermic, Akh-rman, eof273, etroynov, dood
Обновлялась последний раз: mdnwebdocs-bot,