JavaScript에서 배열을 청크로 분할

Sahil Bhosale 2023년10월12일
  1. JavaScript에서slice()메서드를 사용하여 배열 분할
  2. JavaScript에서slice()메서드 및forEach루프를 사용하여 배열의 모든 요소 분리
JavaScript에서 배열을 청크로 분할

JavaScript에서 배열을 가지고 놀고 배열에 대한 다양한 작업을 수행하는 것은 배열 내부의 삽입, 삭제 또는 데이터 조작이든 모든 프로그래머가 알아야 할 매우 일반적인 것입니다.

JavaScript 언어는 배열 데이터 구조를 재생하고 수정할 수있는 다양한 내장 함수를 제공함으로써 우리 삶을 훨씬 더 쉽게 만듭니다. 이 기사에서 논의 할 이러한 방법 중 하나는slice()함수입니다. 이 방법을 사용하면 전체 배열을 다양한 청크로 쉽게 나누거나 분할 할 수 있습니다.

JavaScript에서slice()메서드를 사용하여 배열 분할

slice() 메서드는 배열을 더 작은 청크로 분할하거나 분할하는 데 사용됩니다. 이 함수는startend의 두 매개 변수를 입력으로 사용합니다. start는 배열 분할을 시작하려는 시작 색인을 나타내고end는 분할 또는 분할을 중지하려는 색인을 나타냅니다.

이 프로세스에서 슬라이싱은 지정한end색인 이전에 하나의 색인을 중지합니다. 예를 들어,end5로 정의한 경우 메서드는 이전에 인덱스4에서 하나의 인덱스 분할을 중지합니다.

슬라이싱이 완료된 후 원래 어레이는 변경되지 않습니다. 최신 브라우저는이 방법을 지원합니다.

아래 코드 예제에는integers유형 인numbersArr이라는 배열이 있습니다. startend매개 변수를 전달하여이 배열을 분할하거나 나눌 수 있습니다. 여기에서startend매개 변수로25를 전달했습니다.

let numbersArr = [1, 2, 3, 4, 5, 6, 7, 8];

console.log(numbersArr.slice(2, 5));
console.log('Original Array: ', numbersArr);

출력:

[3, 4, 5]
Original Array: [1, 2, 3, 4, 5, 6, 7, 8]

색인2에서 요소 번호3이 있고 색인5앞에 하나의 색인이 있으므로 요소 번호5가 있습니다. 따라서slice()메소드는이 배열을 분할하고 출력을[3, 4, 5]로 얻습니다. 이미 논의했듯이 원래 배열은 변경되지 않고 그대로 유지되므로numbersArr배열을 인쇄하면 모든 요소가 출력으로 존재하는 전체 배열을 얻을 수 있습니다.

startend매개 변수는 모두 선택 사항입니다. start위치를 지정하지 않으면slice()메소드가0을 기본값으로 사용합니다. end위치를 지정하지 않으면array.length메소드를 사용하여 배열의 마지막 요소로 이동합니다.

JavaScript에서slice()메서드 및forEach루프를 사용하여 배열의 모든 요소 분리

모든 배열 요소를 나누거나 분할하기 위해slice()메서드와for루프를 모두 사용할 수 있습니다. 여기에서for루프를 사용할 수도 있습니다. 문제가되지 않습니다. 또한 동일한numbersArr배열도 있습니다. 배열에서 forEach 루프를 사용할 때마다 콜백 함수를 전달해야합니다.이 함수는 두 가지를 제공합니다. 첫 번째는 배열 자체의 요소이고 두 번째는 색인입니다. 반복 할 때마다 배열의 각 요소를 살펴보고 해당 인덱스를 가져옵니다.

let numbersArr = [1, 2, 3, 4, 5, 6, 7, 8];

numbersArr.forEach((value, index) => {
  console.log(numbersArr.slice(index, index + 1));
});

출력:

[ 1 ]
[ 2 ]
[ 3 ]
[ 4 ]
[ 5 ]
[ 6 ]
[ 7 ]
[ 8 ]

index값을start매개 변수로 전달하고index + 1을 종료 매개 변수로slice()메소드에 전달합니다. 예를 들어 인덱스 값이0이면index + 10 + 1 = 1이됩니다. 그리고slice()메소드가 끝 인덱스 이전에 한 요소를 중지한다는 것을 알고 있으므로 여기서 배열의 모든 요소를 ​​분할하려고합니다. 따라서 처음에split(0,1)을 전달하여 메소드가 배열에서 한 번에 하나의 요소를 가져와 인쇄하도록합니다.

두 번째 반복에서는split(1,2)가됩니다. 세 번째 반복은split(2,3)이며 배열의 끝에 도달 할 때까지 계속됩니다.

이렇게하면 배열의 모든 요소를 ​​다양한 청크로 분할 할 수 있습니다. 나중에 코드에서 이러한 개별 요소에 액세스하려는 경우 필요에 따라 모든 요소에 대해 별도의 배열을 만들어 이러한 요소를 저장할 수도 있습니다.

Sahil Bhosale avatar Sahil Bhosale avatar

Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.

LinkedIn

관련 문장 - JavaScript Array