20 декабря 2018 г. • ⌛ 3 мин чтения

Краткая история любви к экспериментальному новому дополнению к методам Array — Flat и FlatMap. Мы можем выровнять любой нерегулярный массив (массив, который содержит массив или массивы) независимо от уровня глубины, а также возможность одновременного выравнивания и сопоставления — очень крутая функция, появившаяся в JavaScript после того, как весь Array.smoosh эпизод.

Маленькая история

Вы когда-нибудь слышали о #SmooshGate? TC39 рабочая группа, работающая над JavaScript (ECMAScript), выпустила Array.prototype.flatten` для рекурсивного выравнивания массива до заданной глубины. И это сломало сеть 😭😭😭.

Им нужно было найти быстрое исправление ошибки и спасти мир. При исправлении ошибки, почему? очень важно. Они обнаружили, что причиной был MooTools, так как он реализовал метод сглаживания, перезаписывающий значение по умолчанию Array.prototype.flatten. Автор предложения предложил изменить название с flatten на smoosh. Странное предложение? Подробнее здесь.

Он был переименован в flat после встречи TC39 в мае 2018 года и был включен Array.prototype.flatMap.

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

const flatten = (arr, depth = 1) => arr.reduce( 
  (a, v) => a.concat(
    depth > 1 && Array.isArray(v) ? flatten(v, depth - 1) : v
  ), [] ) 
const flattened = arr => [].concat(...arr)
function flattenArray(arr) { 
  const flattened = [].concat(...arr) 
  return flattened.some(
    item => Array.isArray(item)) ? flattenArray(flattened) : flattened ) 
} 
flattenArray([1, 2, [3, [4, 5]], 5, 6])

Используйте рекурсию, затем уменьшайте глубину на 1 для каждого уровня глубины. Используйте Array.prototype.reduce() и `Array.prototype.concat()` для объединения элементов или массивов. Базовый случай, для глубины, равной 1, останавливает рекурсию. Опустите второй аргумент, глубина выравнивания только до глубины 1 (одиночное выравнивание).

Lodash пригодится здесь с несколькими утилитами, такими как flatten, которые выравнивают массив на один уровень в глубину. flattenDeep рекурсивно сглаживает массив. flattenDepth также рекурсивно сглаживает массив до глубины, которая по умолчанию равна 1.

import _ from 'lodash' 
_.flatten([1, [2, [3, [4]], 5]]) 
_.flattenDeep([1, [2, [3, [4]], 5]]) 
var array = [1, [2, [3, [4]], 5]] 
_.flattenDepth(array, 1) 
_.flattenDepth(array, 2)

Глубоко сглаживает массив

Используйте рекурсию. Используйте Array.prototype.concat() с пустым массивом ([]) и оператором расширения (…), чтобы сгладить массив. Рекурсивно сгладьте каждый элемент, являющийся массивом.

const deepFlatten = arr => [].concat(
  ...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v))
)

Теперь узрите свое будущее

Синтаксис для flat и flatMap

var newArray = arr.flat([depth]); 

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) { }[, thisArg])
[1, 2, [3, [4, 5]], 5, 6].flatMap( (v, i) => (Array.isArray(v) ? v.flat() : v) )

Будущее здесь не просто равномерно распределено. С помощью двух методов мы можем легко сгладить массив. flatMap сочетает в себе мощь обычной карты и квартиры.

[1, 2, [3, [4, 5]], 5, 6].flat(Infinity) 
[1, 2, [3, [4, 5]], 5, 6].flat()  
[1, 2, [3, [4, 5]], 5, 6].flat(2)

Плоский метод удаляет пустые слоты в массивах и будет очень полезен при очистке массивов.

const arr = [1, 2, , 4, 5]; arr.flat()

Спецификация и поддержка

Он все еще находится на этапе рекомендации кандидата 3 в предложениях TC39, что означает, что его реализовали лишь очень немногие браузеры. Google Chrome поддерживает запуск с версии 69, а Firefox — с версии 62, а Opera и Safari — с версии 56 и 12 соответственно.

Nodejs вообще не поддерживает его.

Первоначально опубликовано на oluwasetemi.github.io.