[TIL]210223

코드 변환(고차함수)

let arr = [1,2,3,4,5]
const filterMaped = arr.filter(x => x % 2 !== 0).map(x => x * 2);
console.log(filterMaped) // [2, 6, 10]

위의 코드는 [1,2,3,4,5]를 가진 arr라는 변수에 filter메소드를 사용해 요소마다 홀수인 요소들만 모아 새로운 배열을 반환한다.
홀수인 요소들만 모은 새로운 배열에 map()메소드를 사용하여 각요소들마다 2씩 곱해주어 새로운 배열을 반환하고 filterMaped라는 변수에 할당해준다.
그리고 filterMaped변수를 호출하면 홀수인 요소들만 골라 2씩 곱한 값을 출력하게 된다.

filter(): filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환하는 메소드입니다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

map(): map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.

const array1 = [1, 4, 9, 16];

const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

위의 코드를 reduce를 사용하여 작성하면

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

//reduce메소드를 이용해서 acc에는 초기값으로 []빈배열을 할당하고 cur에는 요소 1이 담기게된다.
let isOdd = arr.reduce(function (acc, cur) {
  // cur에 요소가 하니씩 바뀌면서 조건문(홀수인지)의 조건이 참이되면 acc에 cur의 값의 곱하기 2를 해주어 push를 해준다.
    if (cur % 2 !== 0) {
        acc.push(cur * 2)
    }
  // 홀수인 요소중에 2를 곱한 값들만 담긴 acc배열을 리턴하여 isOdd변수에 할당해준다.
    return acc
}, [])

console.log(isOdd) // [2,6,10]

reduce(): reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다.
리듀서 함수는 네 개의 인자를 가집니다.
1. 누산기(acc)
2. 현재 값(cur)
3. 현재 인덱스(idx)
4. 원본 배열(src)

function sum (arr) {arr.reduce(function(acc, cur) {
    acc + cur
    return acc
	}) 
}
sum([1,2,3,4,5]) // 15

정리

reduce메소드를 사용하여 초기값으로 acc에 [] 빈배열을 할당해주고 cur에는 0번 인덱스 값부터 할당해서 조건문에 맞지 않으면 다음 인덱스 값으로 cur값이 변경된다.
조건문의 조건에 맞다면 조건에 맞는 요소(cur)에 * 2를 하여 빈배열인 acc에 push를해주고 조건문을 나가 return acc를 함으로써 acc배열에 값이 하나씩 저장이 되고 모든 요소를 다 돌았을 때 홀수인 요소중에 2를 곱한 값들을 담은 acc를 isOdd라는 변수에 할당해주었다.