중첩된 배열구조 - flatten, unflatten

 

flatten - 납작하게[반반하게] 만들다.

중첩된 배열구조를 하나의 배열로 만드는 것을 의미한다.

 

unflatten

반대로 중첩된 배열구조를 의미한다.

let array = [[1,2],[3,4]];

 

 

Array.prototype.flat()

 

flat() 메서드는 모든 하위 배열 요소를 지정한 깊이까지 평평하게 만든 새로운 배열을 생성한다. 

 

let array = [[1,2],[3,4]];

array.flat(); // [1,2,3,4]

array.flat()의 반환결과는 [1,2,3,4]다.

이런 좋은 기능이 있었다니...

 

default 깊이 값은 1이다. 즉 depth 1만큼 평평하게 만든다는 뜻

 

depth는 뭐냐??

let array = [[1,[2,3]],[4]];

 너무..너무 끔찍하고 보기 힘든 배열 구조다...

이렇게 두 번 파고든 상태까지 배열이 있으면 depth 2다. 

여기서 [1,[2,3]]과 [4]는 depth1, 안에 있는 [2,3]은 depth 2

 

let array = [[1,[2,3]],[4]];

array.flat(); // [1,[2,3],4]

여기서 flat을 그냥 쓰면 깊이 1까지만 평평하게 만들기 때문에 [2,3]은 튀어나온 상태로(?) 만들어진다.

즉... 쟤네는 너무 많이 튀어나와있어서 한 번 두들겨서는 안 평평해진다고 생각하면 될 것 같다... 

 

 그럼 평평해지게 하려면?! 몇 번 두들길지를 넣어주면 된다..

 

let array = [[1,[2,3]],[4]];

array.flat(2); // [1,2,3,4]

쾅쾅~~~ 

 

근데 난 몇 번 두들길지 모르겠는데... 그냥 무조건 다 펴줘!!!!하고 싶다면

let array = [[1,[2,3,[4]]],[5]];
array.flat(Infinity); [1,2,3,4,5]

Infinity를 넣으면 된다. I는 대문자! 

 

 

너무 귀여운 기능인 것 같아! 

 

 

이를 reduce와 concat으로도 대신할 수 있다.

 

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


arr.flat();
// [1, 2, 3, 4]

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

const flattened = arr => [].concat(...arr);
// [1, 2, 3, 4]

출처 : MDN, flat

 

 

 

출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/flat

Array.prototype.flat() - JavaScript | MDN