* 일급객체 (first-class object)
- 일반 객체처럼 모든 연산이 가능한 것
- 함수의 매개변수로 전달
- 함수의 반환값
- 할당 명령문
- 동일 비교 대상
* 일급함수 (first-class function)
- 함수가 일반 객체처럼 모든 연산이 가능한 것
- 함수의 매개변수로 전달
- 함수의 반환값
- 할당 명령문
- 동일 비교 대상
[ 함수형 프로그래밍 ]
- 함수단위로 엮어 나가는것
- for loop, if문을 이용한 이용한 절차지향이 아닌 어떤 특정한 일을 수행하는 함수끼리 엮어서 연결해놓은것
- 함수자체를 순수함수로 만드는것이 중요하다.
- 순수함수란?? 함수안에서 불변성을 유지하는것
- 불변성이란??
- 함수안에서 전달받은 매개변수나 또는 함수밖에 있는 특정한 상태를 함수내부에서 수정하지않고 전달받은 인자를 통해서 함수에서 특정한 연산을 수행한뒤 새로운값을 return한다.
- 또한 이를 함수 내부에서 "side effect가 없게만든다."라고 한다. // 에러 감소, 가독성 증가
- side effect란?? 예상하지 않는 부작용 // 결과와는 상관없는 side effect
- 함수내부에서는 외부의 상태를 변경하지 않는다.
- 순수함수를 만듦으로써 에러 감소, 가독성 증가 효과를 만들어낸다.
- 이런 순수함수들을 서로 묶어서 연결해놓는것을 함수형 프로그래밍이라고한다.
- 함수형 프로그래밍을 사용하면 데이터를 변경 x, 변수사용 x, 조건문 x, 반복문 x 깔끔하게 코딩 가능
* 고차함수 (Higher-order function)
- 다른 함수를 인자로 받거나 반환하는 함수
- 인자로 함수를 받거나 (콜백함수)
- 함수를 반환하는 함수를 고차함수라고 한다.
const fruits = ['바나나', '딸기', '포도', '딸기'];
// forEach()
// 배열을 빙글 빙글 돌면서 원하는것(콜백함수)을 할때
// 배열에서 for문 대신 쓸 수 있는 고차함수
// (배열의 요소, 배열의 인덱스, 배열 전체)
fruits.forEach(function (value) {
console.log(value);
});
fruits.forEach((value) => console.log(value));
// -----조건에 맞는(콜백함수) 아이템을 찾을때-----
const item1 = { name: '우유', price: 2 };
const item2 = { name: '쿠키', price: 3 };
const item3 = { name: '김밥', price: 1 };
const products = [item1, item2, item3, item2];
// find: 제일 먼저 조건에 맞는 아이템을 반환
// 내가 찾는 요소가 있다면 true가 return되고 찾은 값이 return된다.
let result = products.find((item) => item.name === '쿠키');
console.log(result);
// findIndex: 제일 먼저 조건에 맞는 아이템의 인덱스를 반환
result = products.findIndex((item) => item.name === '쿠키');
console.log(result);
// some: 배열의 아이템들이 부분적으로 조건(콜백함수)에 맞는지 확인
// 배열의 아이템이 하나라도 맞을 경우 true가 반환된다.
result = products.some((item) => item.name === '쿠키');
console.log(result);
// every: 배열의 아이템들이 전부 조건(콜백함수)에 맞는지 확인
// 배열의 아이템에 대한 조건이 전부 맞을 경우 true가 반환된다.
result = products.every((item) => item.name === '쿠키');
console.log(result);
// filter: 조건에 맞는 모든 아이템들을 새로운 배열로!
result = products.filter((item) => item.name === '쿠키');
console.log(result);
console.clear();
// Map: 배열의 아이템들을 각각 다른 아이템으로 매핑할 수 있는, 변환해서 새로운 배열 생성!
const nums = [1, 2, 3, 4, 5];
result = nums.map((item) => item * 2);
console.log(result);
result = nums.map((item) => {
if (item % 2 === 0) {
return item * 2;
} else {
return item;
}
});
console.log(result);
// Flatmap: 중첩된 배열을 쫘악 펴서 새로운 배열로!
result = nums.map((item) => [1, 2]);
console.log(result);
result = nums.flatMap((item) => [1, 2]);
console.log(result);
result = ['poodle', 'latte'].flatMap((text) => text.split(''));
console.log(result);
// sort 배열의 아이템들을 정렬
// 문자열 형태의 오름차순으로 요소를 정렬하고, 기존의 배열을 변경
const texts = ['hi', 'abc'];
texts.sort();
console.log(texts);
const numbers = [0, 5, 4, 2, 1, 10];
numbers.sort();
console.log(numbers);
// < 0 a가 앞으로 정렬, 오름차순
// > 0 b가 앞으로 정렬, 내림차순
numbers.sort((a, b) => a - b);
console.log(numbers);
// reduce 배열의 요소들을 접어서 접어서 값을 하나로!
result = [1, 2, 3, 4, 5].reduce((sum, value) => (sum += value), 0);
console.log(result);
* 고차함수를 이용한 배열 예시 문제
// 퀴즈1: 주어진 배열 안의 딸기 아이템을 키위로 교체하는 함수를 만들기
// 단, 주어진 배열을 수정하지 않도록!
// input: ['바나나', '딸기', '포도', '딸기']
// output: [ '바나나', '키위', '포도', '키위' ]
const list = ["바나나", "딸기", "포도", "딸기"]
function replace(array, from, to) {
return array.map(value => value === from ? to : value)
}
const result = replace(list, "딸기", "키위")
console.log(result)
// 퀴즈2:
// 배열과 특정한 요소를 전달받아,
// 배열안에 그 요소가 몇개나 있는지 카운트 하는 함수 만들기
// input: [ '바나나', '키위', '포도', '키위' ], '키위'
// output: 2
const list2 = ["바나나", "키위", "포도", "키위"]
function countFn(array, value) {
return array.filter((item)=> item === value).length
}
/* return array.reduce((count, value) => {
if (value === item) {
count++;
}
return count;
}, 0); */
const result2 = countFn(list2, "포도")
console.log(result2)
// 퀴즈3: 배열1, 배열2 두개의 배열을 전달받아,
// 배열1 아이템중 배열2에 존재하는 아이템만 담고 있는 배열 반환
// input: ['바나나', '키위', '포도'], ['바나나', '딸기', '포도', '딸기']
// output: [ '바나나', '포도' ]
const checkList1 = ["바나나", "키위", "포도"]
const checkList2 = ["바나나", "딸기", "포도", "딸기"]
function matchFn(array1, array2) {
return array1.filter( value => array2.includes(value))
}
const result3 = matchFn(checkList1, checkList2)
console.log(result3)
// 퀴즈 4
// 5이상(보다 큰)의 숫자들의 평균
const nums = [3, 16, 5, 25, 4, 34, 21];
// 3번째 요소로 index 4번째 요소로 현재의 배열을 받아와준다.
// 사용하지 않는 인자들은 밑줄표( _ )로 표시
function avg(num) {
return num.filter(value => value >= 5).reduce((sum, value, _, array) => (sum + value / array.length), 0)
}
const result4 = avg(nums)
console.log(result4)