>  기사  >  웹 프론트엔드  >  JavaScript 배열의 축소 방법에 대한 자세한 설명

JavaScript 배열의 축소 방법에 대한 자세한 설명

高洛峰
高洛峰원래의
2016-12-28 09:35:081519검색

소개

먼저 이 메서드의 공식 개요를 살펴보겠습니다. 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;
});

얻은 결과는 다음과 같습니다.

JavaScript 배열의 축소 방법에 대한 자세한 설명이 결과를 분석해 보면 이 콜백 함수는 총 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 중국어 웹사이트를 참고하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.