[Javascript]Array 요소 내의 Array 병합

들어가며

개발을 하다보면 Array내에 Array가 있는 2차원배열을 사용할 떄가 있는데요 이때 2차원배열을 1차원 배열로 변환 하기위해선 어떻게 해야 할까요 한번 알아봅시다!

코드

const list = [[1, 2], [3, 4], [5, 6]];

이런 변수가 있다고 생각해 봅시다 출력 결과는 다음과 같습니다

[ [ 1, 2 ], [ 3, 4 ], [ 5, 6 ] ]

저희가 원하는건 이게 아니죠 1차원 배열로 만들어 봅시다

const list = [[1, 2], [3, 4], [5, 6]];

const allLlist = list.reduce((prev, curr) => [ ...prev, ...curr], []);

신기한 함수가 있네요 reduce 함수입니다. reduce 에 들어가는 매개변수는 다음과 같습니다

첫 번째 매개변수는 reducer 함수입니다. 이 함수는 4개의 매개변수(prev, curr, index, arr)를 받습니다. prev(이전 값)는 콜백 함수의 반환값을 받으며, 초기값으로 사용됩니다.

curr(현재 값)는 배열의 현재 요소입니다. index(현재 인덱스)는 배열의 현재 인덱스입니다. arr(배열 전체)는 reduce() 메서드가 호출된 배열입니다. reducer 함수는 이전 값(prev)과 현재 요소(curr)를 계산하여 새 값을 반환합니다.

두 번째 매개변수는 초기값(initialValue)입니다. 이 매개변수는 생략할 수 있으며, 초기값이 없을 경우 배열의 첫 번째 요소가 자동으로 초기값이 됩니다. 초기값이 있다면, reduce() 메서드는 배열의 첫 번째 요소부터 시작하여 reducer 함수를 적용할 때, 초기값이 이전 값(prev)으로 사용됩니다.

출력결과는 다음과 같습니다

[ 1, 2, 3, 4, 5, 6 ]

감사합니다~