Как сгладить массив в JavaScript

Практическое руководство по сглаживанию массивов JavaScript

ES2019представил два новых метода для прототипа Array:flatиflatMap. Оба они очень полезны для того, что мы хотим делать:сгладить массив.

Посмотрим, как они работают.

Но сначала небольшое предупреждение: только Firefox 62+, Chrome 69+, Edge 76+ и Safari 12+ уже поддерживают эти 2 метода, поскольку они появились сравнительно недавно. Проверитьтекущая поддержка браузераи помните, что вы можете использоватьВавилондля резервного копирования вашего кода в предыдущую версию ES, если вам нужно поддерживать старые браузеры.

Если вы не хотите иметь дело с Babel, и у вас еще нет этапа сборки, возможно, имеет смысл использоватьflatten(),flattenDeep()иflattenDepth()функции, предоставляемые Lodash.

Самое замечательное в Lodash то, что вам не нужно импортировать всю библиотеку. Вы можете использовать эти функции по отдельности, используя эти пакеты:

Вот как сгладить массив, используяlodash.flatten:

const flatten = require('lodash.flatten')

const animals = [‘Dog’, [‘Sheep’, ‘Wolf’]]

flatten(animals) //[‘Dog’, ‘Sheep’, ‘Wolf’]

А теперь поговорим о родномflat()иflatMap()Методы JavaScript сейчас.

flat()- это новый метод экземпляра массива, который может создать одномерный массив из многомерного массива.

Пример:

['Dog', ['Sheep', 'Wolf']].flat()
//[ 'Dog', 'Sheep', 'Wolf' ]

По умолчанию он «поднимается» только до одного уровня.

Вы можете добавить параметр вflat()чтобы установить количество уровней, на которые вы хотите сгладить массив.

Установите его наInfinityиметь неограниченное количество уровней:

['Dog', ['Sheep', ['Wolf']]].flat()
//[ 'Dog', 'Sheep', [ 'Wolf' ] ]

['Dog', ['Sheep', ['Wolf']]].flat(2)
//[ 'Dog', 'Sheep', 'Wolf' ]

['Dog', ['Sheep', ['Wolf']]].flat(Infinity)
//[ 'Dog', 'Sheep', 'Wolf' ]

Если вы знакомы с JavaScriptmap()метода массива, вы знаете, что с его помощью вы можете выполнить функцию для каждого элемента массива.

Если нет, проверьте мойРуководство по JavaScript map ().

flatMap()это новый метод прототипа массива, который объединяетflat()сmap(). Это полезно при вызове функции, которая возвращает массив вmap()обратный вызов, но вы хотите, чтобы полученный массив был плоским:

['My dog', 'is awesome'].map(words => words.split(' '))
//[ [ 'My', 'dog' ], [ 'is', 'awesome' ] ]

['My dog', 'is awesome'].flatMap(words => words.split(' '))
//[ 'My', 'dog', 'is', 'awesome' ]

Скачать мою бесплатнуюРуководство для начинающих по JavaScript


Больше руководств по js: