Reduce

Reduce

 

 

 

Reduce

 

• 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환한다.
• 리듀서 함수는 네 개의 인자를 가진다.
  ① 누산기 accumulator (acc)
  ② 현재 값 (cur)
  ③ 현재 인덱스 (idx)
  ④ 원본 배열 (src)
• reduce라는 이름은 이 메서드가 보통 배열을 값 하나로 줄이는 데 쓰이기 때문에 붙였다.
• 예를 들어 배열에 들어있는 숫자를 더하거나 평균을 구하는 것은 배열을 값 하나로 줄이는 동작이다.
• 하지만, reduce가 반환하는 값 하나는 객체일 수도 있고, 다른 배열일 수도 있다.

 

arr.reduce(callback[, initialValue])

view raw reduce hosted with ❤ by GitHub

 

arr.reduce((누적값, 현잿값, 인덱스, 요소) => { return 결과 }, 초깃값);

view raw reduce hosted with ❤ by GitHub

┌ callback : 배열의 각 요소에 대해 실행할 함수, 다음 네가지 인수를 받는다.

├       ┌ accumulator(누산기) : 콜백의 반환값을 누적한다.

├       ├ currentValue : 처리할 현재 요소

├       ├ currentIndex(optional) : 처리할 현재 요소의 인덱스

├       └ array(optional) : reduce()를 호출한 배열

└ initialValue(optional) : callback의 최초 호출에서 첫 번째 인수에 제공하는 값,

                                           초기값을 제공하지 않으면 배열의 첫번째 요소를 사용한다.

 

 

 

예시 

 

	(function test(){
	let array = [0,1,2,3,4];
	array.reduce(function(acc, cur, i, arr){
	console.log(acc);
	console.log(cur);
	console.log(i);
	console.log(arr);
	});
	})();
	//0,1,1,[0,1,2,3,4]
	//undifined,2,2,[0,1,2,3,4]
	//undifined,3,3,[0,1,2,3,4]
	//undifined,4,4,[0,1,2,3,4]

view raw reduce hosted with ❤ by GitHub

┌ reduce 메서드는 배열의 length-1번 반복 된다.

├ initialValue(초기값)가 없을 때 배열의 첫번째 인자가 acc가 되므로, cur이 두번째 인자 값이 된다.

├ callbackFunction에 의해 반환되는 값이 다음의 acc 값이 되지만,

├ 위의 callbackFunction은 리턴 값이 없으므로 undefined가 출력된다.

└ 반대로 리턴 값을 넣어 배열 내 인수의 총 합을 구하는 함수를 만들 수 있다.

 

 

 

	(function test(){
	let array = [0,1,2,3,4];
	array.reduce(function(acc, cur, i, arr){
	console.log(acc);
	console.log(cur);
	console.log(i);
	console.log(arr);
	return acc+cur;
	});
	})();
	//0,1,1,[0,1,2,3,4]
	//1,2,2,[0,1,2,3,4]
	//3,3,3,[0,1,2,3,4]
	//6,4,4,[0,1,2,3,4]

view raw reduce hosted with ❤ by GitHub

회차	previousValue	currentValue	currentIndex	array1
1	0	1	1	[0, 1, 2, 3, 4]
2	1	2	2	[0, 1, 2, 3, 4]
3	3	3	3	[0, 1, 2, 3, 4]
4	6	4	4	[0, 1, 2, 3, 4]

하지만 여기서 잠깐 !!! 

┌ 어째서 인수의 합은 10인데 위에서는 누적값이 6이 나왔을까 ?

├ reduce 함수가 마지막으로 반복될 때 console.log에 6, 4, 4, [0, 1, 2, 3, 4]를 찍고,

├ 그 다음 합을 구한 return 값이 10이 되기 때문이다.

└ 아래는 리턴 값이 10이 되게하기 위한 예시이다.

 

 

	let array = [0, 1, 2, 3, 4];
	let sum = array.reduce(function (acc,cur,i,arr) {
	console.log(acc);
	console.log(cur);
	console.log(i);
	console.log(arr);
	return acc + cur;
	});
	console.log(sum); //10

view raw reduce hosted with ❤ by GitHub