1. Flatten

(1) Flatten이란?

Javascript에서 Flatten이란 배열 구조 안에 또 다른 array를 인덱스로 가질 때 즉, 이중 배열일 때 배열을 평평하게 만드는 작업을 말한다.

이렇게 말로 표현하면 굉장히 어려운 말처럼 보이지만, flat method를 통해 살펴보면 이해하기 쉽다!

(2) Faltten 살펴보기 - flat method

1) flat( )

모든 하위 배열 요소를 지정한 깊이까지 재귀적으로 이어붙인 새로운 배열을 생성한다.
또한 배열의 구멍을 제거하기도 한다.

2) flat( ) 살펴보기

const arr1 = [1, 2, [3, 4]]
arr1.flat() // [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]]
arr2.flat() // [1, 2, 3, 4, [5, 6]]

const arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2) // [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity) // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

const arr5 = [1,2, , 4, 5]
arr5.flat() // [1, 2, 4, 5]

3) flat의 대안 reduce와 concat

[1] reduce( )

arr.reduce(callback[, initialValue])

배열의 각 요소에 대해 주어신 reducer 함수를 실행하고, 하나의 결과값을 반환한다.
reducer 함수의 반환값은 누산기에 할당되고, 누산기는 순회 중 유지되므로 최종 결과는 하나의 값이 된다.

[2] reduce( ) 살펴보기

const arr1 = [1, 2, 3, 4]

const initialValue = 0
const sumWithInitial = arr1.reduce(
  (pre, cur) => {return pre += cur}, initialValue
)  
console.log(sumWithInitial) // 10

주어진 배열에서 음수, 양수 개수 카운트해서 출력

const numbers = [2, -5, -123, 59, -5480, 24, 0, -69, 349, 3];
const result = numbers.reduce((acc, cur, idx) => { 
  if(cur < 0){
    // 처리할 현재 요소가 음수일 경우
    acc[0]++;
  }
  else if(cur > 0){
    // 처리할 현재 요소가 양수일 경우
    acc[1]++;
  }
  return acc;
 }, [0,0]);

console.log(result);  // [4, 5]

[3] reduce와 concat으로 flat 대체하기

const arr = [1, 2, [3, 4]];

arr.reduce((acc, val) => acc.concat(val), []);
// [1, 2, 3, 4]

(3) unflatten 살펴보기

1) unflatten이란?

unflatten은 flatten과 반대로 배열을 중첩시켜주는 기능이다.
method를 따로 못찾는건지 모르겠지만, 별도의 method는 없어보인다.

method를 못찾은 대신, npm에서 찾은 unflatten 라이브러리? 발견!

<참조 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/flat
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
https://miiingo.tistory.com/365 >