소개
먼저 이 메서드의 공식 개요를 살펴보겠습니다. Reduce() 메서드는 누산기(accumulator)로 함수를 받고 배열의 각 값(왼쪽에서 오른쪽으로) 감소하기 시작하고 마침내 값이 나옵니다.
나처럼 조금 헷갈리실 수도 있겠네요. 사실, Reduce는 배열이 끝날 때까지 배열의 각 항목을 호출하는 콜백 함수를 받습니다.
모두가 쉽게 이해할 수 있도록 예를 들어보겠습니다.
배열로 구성된 문자열이 있고 배열이 모두 숫자라고 가정해 보겠습니다. 이 숫자의 합을 계산하고 싶습니다. 일반적으로 우리는 하나씩 반복하고 추가합니다. 감소를 사용하면 한 줄의 코드만 사용하면 됩니다.
var total = [0,1,2,3,4].reduce((a, b)=>a + b); //10
이 방법은 어떻게 작동하나요?
reduce는 다음과 같은 4개의 매개변수가 있는 함수를 허용합니다.
1. 마지막 값
2. 현재 값; 현재 값의 인덱스
4. 배열;
위의 배열을 예로 들어 다음 매개변수를 출력해 보겠습니다.
[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){ return previousValue + currentValue; });
얻은 결과는 다음과 같습니다.
이 결과를 분석해 보면 이 콜백 함수는 총 4번 호출되었습니다. 이번에는 첫 번째 이전 값이 없기 때문입니다. 이므로 배열의 두 번째 항목에서 직접 시작하여 배열의 끝을 호출합니다.
reduce에도 두 번째 매개변수가 있습니다. 위의 예에서는 두 번째 매개변수가 없으므로 두 번째 항목에서 직접 가져옵니다. 시작하려면 두 번째 매개변수에 5를 제공하면 결과는 다음과 같습니다.
[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){ return previousValue + currentValue; },5);
first time이 전달된 두 번째 매개변수 대신 배열의 길이인 함수를 5번 호출했습니다.
축소는 축적 외에도 2차원 배열을 평면화하는 데 도움이 됩니다.
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) { return a.concat(b); }, []); // flattened == [0, 1, 2, 3, 4, 5]
정리
지금 생각해보면 흔히 쓰이는 두가지인데, 쓸만한 곳이 많을 것 같아요. 이상이 이 글의 전체 내용입니다. 모든 분들의 공부나 업무에 조금이나마 도움이 되었으면 좋겠습니다. 궁금한 점이 있으시면 메시지를 남겨주세요.
JavaScript의 배열 축소 방법에 대한 자세한 내용은 PHP 중국어 웹사이트를 참고하세요!