Reduce 메서드

Coddy JavaScript 여정의 논리 & 흐름 섹션에 포함된 레슨. 65개 중 54번째.

reduce() 메서드는 배열의 각 요소에 대해 제공된 함수를 실행하여 배열을 단일 값으로 "축소(reduce)"할 수 있게해 줍니다. 이 단일 값은 숫자, 문자열, 객체 또는 다른 배열이 될 수도 있습니다.

다음은 reducer의 구문입니다:

array.reduce(function(accumulator, currentValue, currentIndex, array) {
    // 업데이트된 accumulator 값을 반환합니다
}, initialValue);

주요 구성 요소:

accumulator: 콜백의 반환 값을 누적합니다 (누계 처리 값이라고 생각하시면 됩니다)

currentValue: 배열에서 처리 중인 현재 요소

currentIndex: (선택 사항) 현재 요소의 인덱스

array: (선택 사항) reduce()가 호출된 배열

initialValue: (선택 사항) 콜백 함수의 첫 번째 호출 시 첫 번째 인수로 사용할 값

예를 들어 - 숫자의 합:

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 15

단계별 작동 방식:

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, curr) => {
    console.log(`Accumulator: ${acc}, Current Value: ${curr}`);
    return acc + curr;
}, 0);

// 출력:
// Accumulator: 0, Current Value: 1
// Accumulator: 1, Current Value: 2
// Accumulator: 3, Current Value: 3
// Accumulator: 6, Current Value: 4
// 최종 결과: 10

챌린지

쉬움

식료품 항목을 나타내는 객체 배열을 인자로 받는 calculateGroceryTotal 함수를 작성하세요.

각 객체는 두 개의 프로퍼티를 가집니다:

name: 문자열 (항목의 이름)
price: 숫자 (항목의 가격)

이 함수는 다음을 수행해야 합니다:

모든 항목의 총비용을 계산합니다.
할인을 적용합니다: - 총액이 100 초과이면 10% 할인 적용
총액이 50 초과 100 이하이면 5% 할인 적용
총액이 50 이하인 경우 할인 없음.

다음 항목을 포함하는 객체를 반환하세요:

originalTotal: 할인 전 합계
discount: 할인된 금액
finalTotal: 할인 적용 후 최종 금액

직접 해보기

function calculateGroceryTotal(items) {
    // 여기에 코드를 작성하세요
    


    return {
        originalTotal: Math.round(originalTotal * 100) / 100,  // 소수점 2자리로 반올림
        discount: Math.round(discount * 100) / 100,
        finalTotal: Math.round(finalTotal * 100) / 100
    };
}

실력 점검

이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.

논리 & 흐름의 모든 레슨

직접 연습해 보세요: 온라인 JavaScript 컴파일러