9/20 TIL

정민세·2022년 9월 20일
0

고차함수 (higher-order function)

일급 객체(frist-class citizen)

  1. 변수에 할당 할 수 있다.
  2. 다른 함수의 전달인자로 전달될 수 있다.
  3. 다른 함수의 결과로서 리턴될 수 있다.

변수에 할당하는 경우

 const sum = function (num) {
  return num + num;
}
output = sum(7);		// 변수에 함수가 할당되어 있어 함수 호출 연산자 '()'를 사용할 수 있다.
console.log(output); // --> 14

다른 함수를 인자로 받는 경우

function double(num) {
  return num * 2;
}
fucntion doubleNum(func, num) {
  return func(num);
}
let output = doubleNum(double, 4);  // 함수 doubleNum의 콜백 함수로 함수 double을 사용할 수 있다.
console.log(output); // --> 8

함수를 리턴하는 경우

function adder(added) {
	return function (num) {
    	return num + added;
};
}
let output = adder(5)(3); // --> 8
// add(5)는 함수이므로 함수 호출 연산자 '()'를 사용할 수 있다.
console.log(output); // --> 8
const add3 = adder(3);
// adder가 리턴하는 함수를 변수에 저장할 수 있습니다.
// javascript에서 함수는 일급 객체이기 때문입니다.
output = add3(2);
console.log(output); // --> 5

함수를 인자로 받고, 함수를 리턴하는 경우

function double(num) {
  return num * 2;
}
function doubleAdder(added, func) {
  const doubled = func(added);
  return function (num) {
    return num + doubled;
  };
}
/*
 * 함수 doubleAdder는 고차 함수입니다.
 * 함수 doubleAdder의 인자 func는 함수 doubleAdder의 콜백 함수입니다.
 * 함수 double은 함수 doubleAdder의 콜백으로 전달되었습니다.
 */
// doubleAdder(5, double)는 함수이므로 함수 호출 기호 '()'를 사용할 수 있습니다.
doubleAdder(5, double)(3); // -> 13
// doubleAdder가 리턴하는 함수를 변수에 저장할 수 있습니다. (일급 객체)
const addTwice3 = doubleAdder(3, double);
addTwice3(2); // --> 8

Filter()

  • 데이터 집합에서 특정 조건을 만족하는 값만 반환받기를 원할 때 filter 메소드를 사용

    arr.filter(callback(element[, index[, array]])[, thisArg])
    callback : 각 요소에 대한 조건값
    element : 처리할 현재 요소
    index : 현재 인덱스
    array : filter를 호출한 배열
    thisArg : callback을 생행 할 때 this로 사용하는 값

let persons = [
  { age: 20, name: "Hyelim" },
  { age: 26, name: "Semin" },
  { age: 17, name: "Jahan" },
  { age: 15, name: "Chaelim" },
  { age: 31, name: "Soohyeong" }
];
	//나이가 18세 이상인 사람의 정보만 출력
  let result = persons.filter((value) => value.age >= 18)
  

console.log(result); /*[
  { age: 20, name: 'Hyelim' },
  { age: 26, name: 'Semin' },
  { age: 31, name: 'Soohyeong' }
] */

Map()

  • map()은 내부적으로 배열의 요소를 모두 순회하며 연산을 수행하고, 그 값들을 새로운 배열에 추가하여 리턴

    arr.map(callback(currentValue[, index[, array]])[, thisArg])
    callback : 새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가집니다.
    currentValue : 처리할 현재 요소.
    index : Optional처리할 현재 요소의 인덱스.
    array : Optionalmap()을 호출한 배열.
    thisArg : Optionalcallback을 실행할 때 this로 사용되는 값.

let numbers = [1, 4, 9];
let doubles = numbers.map(num => num * 2);
// doubles는 이제 [2, 8, 18]
// numbers는 그대로 [1, 4, 9]

Reduce()

  • reduce()는 배열의 모든 요소들에 대해서 연산을 수행하여 하나의 결과 값을 리턴
const arr = [1, 2, 3, 4];

const initialValue = 0;
const sumArr = arr.reduce(
  (previousValue, currentValue) => previousValue + currentValue,
  initialValue
);

// 0 + 1 + 2 + 3 + 4
console.log(sumArr);  //10

/* debugger;
acc: 0, cur: 1, curIndex: 0, array: 0+1
acc: 1, cur: 2, curIndex: 1, array: 1+2
acc: 3, cur: 3, curIndex: 2, array: 3+3
acc: 6, cur: 4, curIndex: 3, array: 6+4
10
profile
하잇

0개의 댓글