|
| 1 | +# 12. 함수형 반복 |
| 2 | + |
| 3 | +- [map()](#map) |
| 4 | +- [filter()](#filter) |
| 5 | +- [reduce()](#reduce) |
| 6 | + |
| 7 | +## map() |
| 8 | + |
| 9 | +```tsx |
| 10 | +function map(array, f) { |
| 11 | + // 배열, 함수를 받음 |
| 12 | + var newArray = []; // 빈 배열 |
| 13 | + forEach(array, function (element) { |
| 14 | + // 원래 배열 항목으로 새로운 항목을 만듦 |
| 15 | + newArray.push(f(element)); |
| 16 | + }); |
| 17 | + // 새로운 배열 리턴 |
| 18 | + return newArray; |
| 19 | +} |
| 20 | + |
| 21 | +map(customers, (customer) => customer.email); |
| 22 | +``` |
| 23 | + |
| 24 | +- X(어떤 값의 집합) 값이 있는 배열을 Y(또 다른 값의 집합) 값이 있는 배열로 변환 |
| 25 | +- X를 Y로 바꾸는 함수: X를 인자로 받아 Y를 리턴 |
| 26 | +- map()에 계산을 넘기면 map()을 사용하는 코드도 계산임, 액션을 넘기면 액션이 됨 |
| 27 | + |
| 28 | + |
| 29 | +--- |
| 30 | + |
| 31 | + |
| 32 | +## filter() |
| 33 | + |
| 34 | +```tsx |
| 35 | +function filter(array, f) { |
| 36 | + // 배열, 함수를 받음 |
| 37 | + var newArray = []; |
| 38 | + forEach(array, function (element) { |
| 39 | + // f()를 호출해 항목을 결과 배열에 넣을지 확인 |
| 40 | + if (f(element)) { |
| 41 | + // 조건에 맞으면 원래 항목을 결과 배열에 넣음 |
| 42 | + newArray.push(element); |
| 43 | + } |
| 44 | + }); |
| 45 | + // 결과 배열 리턴 |
| 46 | + return newArray; |
| 47 | +} |
| 48 | + |
| 49 | +var emailsWithoutNulls = filter(emailsWithNulls, (email) => email !== null); |
| 50 | +``` |
| 51 | + |
| 52 | +- 원래 배열을 가지고 새로운 배열을 만드는 고차 함수 |
| 53 | +- 항목이 X인 배열에 filter()를 사용해도 결과는 여전히 항목이 X인 배열이지만 남길 배열을 선택하기에 원래 가진 항목보다 적을 수 있음. |
| 54 | +- 전달하는 함수가 계산일 때 가장 사용하기 쉬움 |
| 55 | + |
| 56 | + |
| 57 | +--- |
| 58 | + |
| 59 | + |
| 60 | +## reduce() |
| 61 | + |
| 62 | +```tsx |
| 63 | +function reduce(array, init, f) { |
| 64 | + // 배열, 추깃값, 누적 함수를 받음 |
| 65 | + // 누적된 값을 초기화 |
| 66 | + var accumulator = init; |
| 67 | + forEach(array, function (element) { |
| 68 | + // 누적 값 계산하기 위해 현재 값과 배열 항목으로 f() 함수 부름 |
| 69 | + accumulator = f(accumulator, element); |
| 70 | + }); |
| 71 | + // 누적된 값 리턴 |
| 72 | + return accumulator; |
| 73 | +} |
| 74 | + |
| 75 | +// reduce()에 전달하는 함수는 인자 두 개 (현재 누적된 값, 배열의 현재 항목) 받음 |
| 76 | +reduce(strings, "", (accum, string) => accum + string); |
| 77 | +``` |
| 78 | + |
| 79 | +- 배열 순회하며 값을 누적해가는 고차 함수 |
| 80 | +- 전달하는 함수를 통해 누적하는 방법 결정 |
| 81 | +- reduce()에 전달하는 함수는 인자로 현재 누적된 값과 배열의 현재 항목을 받고 첫 번째 인자와 같은 타입의 값을 리턴해야 함 |
| 82 | +- 초깃값 결정할 때 주의 |
| 83 | + - 계산이 어떤 값에서 시작되는가 - 더하기면 초깃값 0, 곱하기 하면 초깃값 1 |
| 84 | + - 배열이 비어 있다면 어떤 값을 리턴할 것인가 |
| 85 | +- reduce()로 할 수 있는 것들 |
| 86 | + - map(), filter() 만들기 |
| 87 | + - 실행 취소/실행 복귀 - 실행 취소: 리스트의 마지막 사용자 입력을 없애는 것 |
| 88 | + - 테스트할 때 사용자 입력을 다시 실행하기 - 초깃값은 시스템 처음 상태이고 사용자 입력이 순서대로 리스트에 있을 때 reduce()로 모든 값 합쳐 현재 상태 만들 수 있음 |
| 89 | + - 시간 여행 디버깅 - 어떤 언어는 변경 사항을 어떤 시점으로 되돌릴 수 있음. 뭔가 잘못 동작하면 특정 시점 상태의 값 보관, 문제 고치고 새로운 코드로 실행해볼 수있음. |
| 90 | + - 회계 감사 추적 |
0 commit comments