[CS] Reduce 추가 공부 Day-22

reduce 와 reduceRight

forEach, for, for..of를 사용하면 배열 내 요소를 반복 작업할 수 있습니다.

각 요소를 돌면서 반복 작업을 수행하고, 작업 결과물을 새로운 배열 형태로 얻으려면 map을 사용하면 됩니다.

arr.reduce와 arr.reduceRight도 이런 메소드와 유사한 작업을 해줍니다.

주의 사항

arr.reduce와 arr.reduceRight은 배열을 기반으로 값 하나를 도출할 때 사용됩니다.

ex) reduce 기본 문법

let result = arr.reduce(function(acc, cur, index){
	// ...
}, [initial]);

• acc: 이전 함수 호출의 결과
• initial: 함수 최초 호출 시 사용되는 초기값을 나타냄
• cur: 현재 배열 요소
• index: 요소의 위치

이전 함수 호출 결과는 다음 함수를 호출할 때 첫 번째 인수(previousValue)로 사용됩니다.

첫 번째 인수는 앞서 호출했던 함수들의 결과가 누적되어 저장되는 누산기(accumulator)라고 생각하면 됩니다.

reduce를 이용해 코드 한 줄로 배열의 모든 요소를 더한 값을 구할 수 있습니다.

ex)

let arr = [1,2,3,4,5];

let result = arr.reduce(function(acc, cur){
	return acc + cur;
    // 풀어쓰면
    // acc += cur
    // return acc; 가 된다. 
}, 0);

console.log(result); // 결국 출력은 15

reduce에 전달된 함수는 두 개만 받고 있습니다. 일반적으로 두 개만 받습니다.

• 함수 최초 호출 시 마지막 부분 ,0 을 통해 시작점을 정해줍니다. 배열의 첫 번째 요소인 arr[0]이 할당 된 것입니다.

• 이후 계속해서 배열의 2,3,4,5 까지 더하면서 갑니다.
  (acc+cur 이기 때문에 더하면서 갑니다. * 면 곱하면서 갑니다.)

• 위 과정이 반복된 후 결과값을 반환합니다.

초기값을 0으로 줄 필요는 없습니다.

arr.reduceRight도 비슷한 기능이지만 오른쪽부터 연산을 수행한다는 차이점이 있습니다.

Array.isArray를 통한 배열 여부 확인

JavaScript에서 배열은 독립된 자료형으로 취급하지 않고 객체형에 속합니다.

따라서 typeof로는 일반 객체와 배열을 구분할 수 없습니다.
ex)

console.log(typeof {}); // object 출력
console.log(typeof []); // object 출력

배열은 자주 사용되는 자료구조입니다. 따라서 배열인지 아닌지 감별해내는 메소드가 필요합니다. (Array.isArray)

value가 배열이면 true, 배열이 아니라면 false

console.log(Array.isArray({})); // false 출력
console.log(Array.isArray([])); // true 출력

배열 메소드와 'thisArg'

find, filter, map은 thisArg라는 매개변수를 옵션으로 받을 수 있습니다.

ex)

console.log(arr.find(func, thisArg);
console.log(arr.filter(func, thisArg);
console.log(arr.map(func, thisArg);

thisArg는 func의 this가 됩니다.