「flatMap( )」 중첩된 배열을 간단하게 풀자

 

flatMap( )은 배열 내의 배열을 편평하게 한다. flatMap( )이 존재하는 이유는 아래와 같은 중첩배열이 무수히 많을 경우다. 

 

[ [a, b, c ], d, e, [ f, e, [ g, h [ i ] ] ], j, k ]

 

배열 속에 배열, 또 배열... 최근 이러한 구조가 의외로 많다. Iot와 관련된 기기와 센서들이 증가했기 때문이다. 이때 flatMap( )을 사용한다면, 중첩된 배열을 쉽게 풀 수 있다. 아래 예제를 통해 쉽게 이해해보자.

 

const arr1 = [ ['서울', '경기', '인천'], ['대전', '천안'],'대구', '부산'];   const arr2 = arr1.map( (item) => {       return item;   });   console.log(arr2);     // [Array(3), Array(2), '대구', '부산']

[ flatMap( ) 예시1 ]

 

map( )의 경우, 배열 속의 배열이 그대로 반환된다. 따라서 ['서울', '경기', '인천' ], ['대전', '천안']을 수정하기 위해서 다시 배열 내부의 데이터를 반환하는 코드를 추가로 입력해야 한다. 이때 필요한 배열 메서드가 flatMap( )이다. 아래 예시를 보자.

 

const arr1 = [ ['서울', '경기', '인천'], ['대전', '천안'],'대구', '부산'];   const arr3 = arr1.flatMap( (item) => {       return item;   });     console.log(arr3);     // (7) ['서울', '경기', '인천', '대전', '천안', '대구', '부산']

[ flatMap( ) 예시2 ]

 

.flatMap( )을 사용한 결과, "배열 내 배열"이 모두 1차원 배열로 정리된 결과를 반환한다. 물론, '2차, 3차, n차...' 복수로 중첩된 배열의 경우라면 flatMap( )을 여러번 사용해야 하겠지만 이는 따로 함수를 만들어 해결할 수 있다. 

 

복잡한 배열을 풀어야하는 상황이라면, flatMap( )을 한번 시도해보자.