배열을 지정한 개수의 하위 배열로 나누기
숫자로 이루어진 배열을 첫 번째 인수로, 하나의 숫자 num을 두 번째 인수로 받는 자바스크립트 함수를 작성해야 합니다. 이때 num은 항상 배열의 길이보다 작거나 같은 값입니다.
함수는 정확히 num개의 하위 배열을 담고 있는 새로운 배열을 반환해야 합니다. 만약 배열의 길이가 num으로 나누어 떨어진다면 모든 하위 배열은 같은 개수의 요소를 가져야 하고, 나누어 떨어지지 않는다면 마지막 하위 배열만 다른 개수의 요소를 담게 됩니다.
입력 예시
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
const num = 3;
위 입력에 대한 출력은 다음과 같아야 합니다.
const output = [
[1, 2, 3],
[4, 5, 6],
[7, 8]
];
구현 코드
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
const num = 3;
const chunkArray = (arr = [], num = 1) => {
const { length: l } = arr;
const elPerArr = Math.ceil(l / num);
const res = arr.reduce((acc, val, ind) => {
const curr = Math.floor(ind / elPerArr);
if(!acc[curr]){
acc[curr] = [val];
}else{
acc[curr].push(val);
}
return acc;
}, []);
return res;
};
console.log(chunkArray(arr, num));
코드 동작 원리
- Math.ceil(l / num): 배열 길이를 num으로 나눈 값을 올림하여, 각 하위 배열에 배치될 기본 요소 개수를 구합니다.
- reduce(): 배열을 순회하면서 각 요소(val)가 속할 하위 배열의 인덱스를 Math.floor(ind / elPerArr)로 계산합니다.
- 해당 인덱스의 하위 배열이 아직 없으면 새 배열을 만들어 요소를 넣고, 이미 존재하면 push()로 추가합니다.
- 남는 요소들은 자연스럽게 마지막 하위 배열에 몰리므로, '마지막 배열만 개수가 달라져도 된다'는 조건을 충족합니다.
실행 결과
[ [ 1, 2, 3 ], [ 4, 5, 6 ], [ 7, 8 ] ]
대안: slice()를 활용한 방법
reduce 대신 slice() 메서드를 사용하면 더 직관적으로 구현할 수도 있습니다.
const chunkArray = (arr = [], num = 1) => {
const size = Math.ceil(arr.length / num);
return Array.from({ length: num }, (_, i) =>
arr.slice(i * size, (i + 1) * size)
);
};
console.log(chunkArray([1, 2, 3, 4, 5, 6, 7, 8], 3));
// [[1, 2, 3], [4, 5, 6], [7, 8]]Array.from()으로 num 길이의 배열을 생성하고, 각 인덱스에 따라 slice()의 시작과 끝 위치를 계산해 하위 배열을 잘라냅니다. 두 방법 모두 시간 복잡도는 O(n)으로 동일하므로, 코드 가독성과 상황에 맞게 선택하면 됩니다.