반응형
기본 구조는 아래와 같습니다.
Array.reduce(callback[, initialValue])
callback 함수와 initailValue 매개변수를 받습니다. initialValue는 생략가능하며, 생략한다면 배열의 첫번째 값으로 초기화 됩니다. 이러한 규칙으로 인하여 initialValue를 제공하지 않는다면 첫번째 배열 값을 건너뛰어 실행되고, initialValue를 제공하면 첫번째 배열 값도 포함하여 실행됩니다. 아래는 실제로 테스트해본 결과입니다.
callback함수는 네 개의 매개변수를 갖습니다.
- accumulator: reduce 매서드의 핵심입니다. 번역하면 누산기 정도로 말할 수 있습니다. 콜백의 반환값을 누적합니다.
- current value: 처리할 현재 요소의 값입니다.
- current index: 처리할 현재 요소의 인덱스입니다.
- array: reduce 매서드를 호출한 배열입니다.
reduce 매서드를 이용한 가장 간단한 예제는 모든 값을 더하는 것입니다. 아래 그 예제가 있습니다.
reduce를 사용하지 않아도 같은 동작을 하는 로직을 구현할 수는 있지만 코드가 상당한 간단해지니 잘 활용해보면 좋을 것 같습니다. 잘 활용하여 좋은 소스를 만들어봅시다 :)
참고:
반응형
'JavaScript' 카테고리의 다른 글
[JavaScript Patterns] Memoization(메모이제이션) (0) | 2020.07.18 |
---|---|
[JavaScript] Array.find() (0) | 2020.06.05 |
[JavaScript] 이벤트 생성 및 트리거 하기 (0) | 2020.05.25 |
[JavaScript] IE에서 Event.path / Event.composed 사용을 위한 Polyfill (0) | 2020.04.27 |
[JavaScript] 마우스 왼쪽/오른쪽 클릭 판단하기 (0) | 2020.04.23 |