Array.reduce() 이해하기

소개

Javascript 입문 과정을 수강하고 배열의 다양한 방법을 배우면서. 나는 축소 방법의 진정한 힘을 잘 이해하지 못했고 두 번째로 돌아가서야 이 방법이 얼마나 유용한지 깨달았습니다. 이 기사를 통해 이 방법의 작동 방식과 사용 시기를 더 명확하게 이해할 수 있기를 바랍니다.

방법

Array.prototype.reduce(콜백함수)
Array.prototype.reduce(callbackFunction,initialValue)

이 방법의 역할은 정확히 무엇인가요?

reduce() 메서드는 콜백 함수를 사용하여 배열의 각 요소를 처리하고 그 결과를 단일 값으로 누적합니다. 초기값이 제공되면 이는 시작점으로 사용됩니다. 그렇지 않으면 첫 번째 배열 요소가 사용되고 두 번째 요소부터 반복이 시작됩니다.

콜백 함수 매개변수

callbackFunction(누산기, currentValue, currentIndex, 배열){}

누산기

이전 반복에서 누적된 결과 또는 제공된 경우 초기 값입니다.

현재값

현재 처리 중인 배열 요소의 값입니다.

현재지수

현재 요소의 인덱스입니다. 초기 값이 제공되면 0에서 시작하고, 그렇지 않으면 1입니다.

정렬

reduce() 메소드가 실행되는 배열입니다.

초기값

초기 값 없이 축소 메소드를 사용하는 경우 콜백 함수는 배열의 첫 번째 요소를 가져와 이를 누산기로 초기화한 다음 배열의 나머지 부분을 반복합니다.

사용 사례

리듀스 메소드를 사용하면서 접하게 되는 가장 일반적인 예는 배열의 합입니다.

const ages = [23, 15, 45, 13, 66, 54, 38];
let sumOfAges = ages.reduce(function(sumOfAges, currentAge){
    sumOfAges = sumOfAges + currentAge;
    return sumOfAges;
}); // 254

그렇습니다. 이것이 바로 축소 방법의 장점이자 장점이지만, 할 수 있는 일이 훨씬 더 많습니다.

그룹의 최대 연령 얻기

const ages = [23, 15, 45, 13, 66, 54, 38];
let oldestPerson = ages.reduce(function(maxAge, currentAge){
    if(currentAge>maxAge){
        maxAge = currentAge;
    }
    return maxAge;
}); // 66

여기에서는 감소 메소드를 사용하여 배열에서 발견되는 가장 높은 연령을 저장하고 전체 배열을 통해 반복된 후 해당 값을 반환합니다.

배열에서 중복 제거

const store = ['apple', 'pear', 'apple', 'orange', 'apple', 'pear'];
let itemCatalogue = store.reduce(function(uniqueStoreItems, currentItem){
    if(!uniqueStoreItems.includes(currentItem)){
        uniqueStoreItems.push(currentItem);
    }
    return uniqueStoreItems;
}, []); // ['apple', 'pear', 'orange']

중요 여기서는 축소 메서드의 초기 값으로 빈 배열 []을 제공한다는 점에 유의하세요. 이는 누산기가 이제 배열이고 콜백 함수가 해당 배열에 아직 없는 항목만 푸시한다는 것을 의미합니다. 그 결과 중복 항목을 제거했습니다.

배열의 항목 수 가져오기

const store = ['apple', 'pear', 'apple', 'orange', 'apple', 'pear'];
let itemCount = store.reduce(function(count, currentItem){
    count[currentItem] = (count[currentItem] || 0) + 1;
    return count;
}, {}); // { apple: 3, pear: 2, orange: 1 }

중요 여기서 주목해야 할 점은 초기값이 빈 객체라는 것입니다. 매장에 있는 아이템을 살펴보면서 해당 아이템에 개수를 입력합니다.

결론

우선 여기까지 읽어주셔서 감사합니다! 이 글을 쓰는 나의 주요 목표는 축소 방법에 대한 나의 이해를 확고히 하는 것이었고 여러분도 여기서도 새로운 것을 배웠기를 바랍니다! 축소 방법에는 정말 멋진 응용 프로그램이 많이 있으며 사용하기가 정말 깔끔합니다. 이 방법에 대한 다른 사용 사례나 재미있는 트릭이 있습니까? 알고 싶습니다!

위 내용은 Array.reduce() 이해하기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!