Array.prototype.flatMap()

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

{{EmbedInteractiveExample("pages/js/array-flatmap.html")}}

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Синтаксис

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // return element for 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]

// 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 showing usecase of flatMap better.

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.

Alternative

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]

Specifications

Browser compatibility

See also

• Array.prototype.flat()
• Array.prototype.map()
• Array.prototype.reduce()
• Array.prototype.concat()