[JavaScript]배열을 특정 길이만큼 분리하는 방법

배열을 특정 길이만큼 분리하는 방법

JavaScript에서 배열을 특정 길이만큼 분리해야 하는 상황이 존재할 수 있습니다.

 

예를 들어, 배열의 요소가 9개 존재하며, 특정 길이를 3으로 설정하는 경우 배열이 다음과 같이 분리되어야 합니다.

// 분리 전
[0, 1, 2, 3, 4, 5, 6, 7, 8]

// 분리 후
[[0, 1, 2], [3, 4, 5], [6, 7, 8]]

배열의 요소가 8개이며, 특정 길이를 3으로 설정하는 경우 배열이 다음과 같이 분리되어야 합니다.

// 분리 전
[0, 1, 2, 3, 4, 5, 6, 7]

// 분리 후
[[0, 1, 2], [3, 4, 5], [6, 7]]

이번 포스팅은 JavaScript에서 배열을 특정 길이만큼 분리할 수 있는 몇 가지 방법을 소개합니다.

---

방법 1. slice 메서드

첫 번째 방법으로 배열에서 제공하는 slice() 메서드를 사용하여 배열을 특정 길이만큼 분리할 수 있습니다.

arr.slice([begin[, end]])

slice() 메서드는 두 개의 매개변수를 가지며, 모든 매개변수는 생략할 수 있습니다.

 

begin

- 배열을 분리하는 시작 위치입니다.

- 생략된 경우 0번째 인덱스부터 분리합니다.

 

end

- 배열을 분리하는 마지막 위치입니다.

- 생략된 경우 첫 번째 매개변수(begin)부터 배열의 마지막 위치까지 분리합니다.

 

slice() 메서드는 begin부터 end까지 배열의 얕은 복사본을 새로운 배열로 반환합니다.

 

다음 예제는 slice() 메서드를 사용하여 배열의 요소가 8개인 배열을 3개의 요소를 가지는 배열로 분리합니다.

function splitIntoChunk(arr, chunk) {
  // 빈 배열 생성
  const result = [];
  
  for (index=0; index < arr.length; index += chunk) {
    let tempArray;
    // slice() 메서드를 사용하여 특정 길이만큼 배열을 분리함
    tempArray = arr.slice(index, index + chunk);
    // 빈 배열에 특정 길이만큼 분리된 배열을 추가
    result.push(tempArray);
  }
  
  return result;
}

// 배열의 요소가 8개인 배열
const srcArray = [0, 1, 2, 3, 4, 5, 6, 7];
// 특정 길이
const chunk = 3;
// 특정 길이만큼 분리된 새로운 배열
const newArray = splitIntoChunk(srcArray, chunk);

console.log(srcArray);
console.log(newArray);

[실행 결과]

---

방법 2. splice 메서드

두 번째 방법으로 배열에서 제공하는 splice() 메서드를 사용하여 배열을 특정 길이만큼 분리할 수 있습니다.

 

slice() 메서드와 달리 기존 배열을 변경하며, 반환 결과는 없습니다.

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

splice() 메서드는 여러 개의 매개변수를 가지며, 첫 번째 매개변수를 제외한 매개변수는 생략할 수 있습니다.

 

start

- 배열의 요소를 삭제 또는 변경하는 시작 위치입니다.

- 생략할 수 없습니다.

- 음수인 경우 배열의 끝에서 시작합니다.

- 예를 들어, -5인 경우 (배열의 길이 - 5)와 동일합니다.

 

deleteCount

- start부터 제거되는 요소의 수입니다.

- 생략된 경우 start부터 배열의 마지막 위치까지 배열의 요소를 제거합니다.

 

item1, item2, ...

- start부터 배열에 추가되는 요소입니다.

- 생략된 경우 splice() 메서드는 start부터 배열의 요소를 제거합니다.

 

다음 예제는 splice() 메서드를 사용하여 배열의 요소가 8개인 배열을 3개의 요소를 가지는 배열로 분리합니다.

function splitIntoChunk(arr, chunk) {
  // 빈 배열 생성
  const result = [];
    
  while(arr.length > 0) {
    let tempArray;
    // splice() 메서드를 사용하여 특정 길이만큼 배열을 분리함
    tempArray = arr.splice(0, chunk);
    // 빈 배열에 특정 길이만큼 분리된 배열을 추가
    result.push(tempArray);
  }
    
  return result;
}

// 배열의 요소가 8개인 배열
const srcArray = [0, 1, 2, 3, 4, 5, 6, 7];
// 특정 길이
const chunk = 3;
// 특정 길이만큼 분리된 새로운 배열
const newArray = splitIntoChunk(srcArray, chunk);

console.log(srcarray);
console.log(newArray);

[실행 결과]