JavaScript의 배열 축소 방법

여러분, 안녕하세요! 오늘은 예전에 많이 고민했던 방법에 대한 글을 써보고자 합니다. 그 방법은 Array.prototype.reduce 방법입니다.

먼저 예제를 사용하여 방법을 보여준 다음 모든 내용을 설명하겠습니다.

아래 예를 확인하십시오.

const numbersToAdd = [0, 1, 2, 3, 4, 5];

const initialValue = 0;
const sum = numbersToAdd.reduce((previousValue, currentValue) => previousValue + currentValue, initialValue);

console.log(sum);

위의 예에서 합계를 원하는 배열이 있으므로 reduce 메서드를 사용하여 전체 배열을 하나의 숫자로 "축소"했습니다. 이것이 바로 이 방법이 하는 일입니다. 배열을 하나의 특정 항목으로 축소합니다.

reduce 메소드는 하나의 콜백 함수와 선택적으로 배열을 줄일 초기 값을 나타내는 다른 하나의 매개변수를 사용합니다. 객체, 숫자, 문자열 등 기본적으로 무엇이든 될 수 있습니다.

initialValue를 지정하지 않으면 reduce 메서드는 배열의 첫 번째 요소를 initialValue로 사용합니다.

그리고 콜백 내에서 콜백 함수는 2개의 매개변수를 사용하고 다른 2개의 선택적 매개변수를 사용할 수 있습니다. 처음 두 개는 각각 previousValue 및 currentValue입니다. 즉, reduce 메서드는 콜백 함수의 반환 값을 다음 루프의 previousValue로 사용하여 효과적으로 배열을 반복합니다. 그리고 이를 사용하여 currentValue 등으로 콜백을 다시 실행합니다.

이 메소드가 취할 수 있는 다른 두 매개변수는 currentIndex와 array입니다. 이 두 가지 이름에서 알 수 있듯이 currentIndex는 해당 배열에 있는 currentValue의 현재 인덱스일 뿐이며, 물론 배열은 반복되는 배열 자체입니다.

다음은 모든 선택적 매개변수가 사용된 또 다른 예입니다.

const peopleData = [["Khan", 23], ["James", 30], ["Molly", 43]];

const initialValue = {};
const peopleObj = peopleData.reduce((previousValue, currentValue, currentIndex, array) => {
  const [name, age] = currentValue;
  previousValue[currentIndex] = {
    name,
    age,
  };

  return previousValue
}, initialValue);

console.log(peopleObj);

좋아, "모든"선택적 매개 변수가 사용되는 부분에 거짓말을 했지만 그게 무슨 뜻인지 알 것 같아요 :D

그리고 JavaScript의 Array Reduce 방법이 있습니다! 이전에는 이것이 왜 나에게 문제를 안겨줬는지 모르겠지만 당신이 겪었을지도 모르는 혼란을 해결했으면 좋겠습니다!

결론

배열 축소 방법은 배열을 하나의 특정 항목으로 줄이는 데 사용되는 방법입니다. 숫자 배열의 합계를 얻거나 정보 배열에서 개체를 만드는 것과 같습니다.

그리고 언제나 그렇듯이 제 코드나 제가 제공한 정보에 오류가 있으면 바로 보고 수정할 수 있도록 댓글을 달아주세요! 피드백은 매우 중요하며 항상 찾고 있습니다.

좋은 하루 되세요! :)