코드스테이츠 프론트엔드 부트캠프 s2u1회고

amberjackman·2023년 5월 10일
0

항상 노션에 나만 보게 따로 정리했는데
그러다보니 블로그를 아예 안적게 된다

이제는 공부도 할 겸
정리를 블로그에 해야겠다..

며칠 차 인지도 모르겠다..
이제 유닛으로 적어야지..

자바스크립트의 함수

함수는 자바스크립트에서
특별대우받는 일급객체로 분류된다

변수에 할당 가능하고
인자로도 사용 가능하고
다른함수에서 리턴도 가능함

그래서
함수를 함수가 다룰 수 있음

고차함수

함수를 인자로 전달할 수 있다
동시에 함수를 리턴할 수 있다
많은 응용이 가능

메소드도 고차함수의 예시로 볼 수 있음

고차함수는 코드를 한번짜고 재활용이 가능하게 하고
모듈화와 추상화가 가능함

콜백함수

그래서 고차함수를 응용하면
콜백함수가 가능

콜백함수 - 다른 함수에 전달되어 이벤트가 발생했을 때 실행되는 함수

고차함수는 콜백함수를 인자로 받을 수 있음

setTimeout 메서드가 그 예시

function sayHello() {
  console.log("안녕");
}

setTimeout(sayHello, 3000);

setTimeout - 고차함수
sayHello - 콜백함수

내장 고차함수

filter

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter(function(num) {
  return num % 2 === 0;
});

console.log(evenNumbers); /// [2, 4, 6, 8, 10]

조건에 부합하는 것만 골라냄

map

const numbers = [1, 2, 3, 4, 5];

const squaredNumbers = numbers.map(function(num) {
  return num ** 2;
});

console.log(squaredNumbers); // [1, 4, 9, 16, 25]

조건에 맞춰진 새로운 배열을 생성해냄

reduce

const numbers = [1, 2, 3, 4, 5];

const squaredNumbers = numbers.map(function(num) {
  return num ** 2;
});

console.log(squaredNumbers); [15]

하나로 합쳐냄

reduce는 기본적으로 두 개의 매개변수를 사용함
초기값을 제공하지 않을 경우 첫 번째 요소를 초기값으로 사용함

초기값을 제공할 경우 첫 번째 매개변수는 초기값, 두 번째 매개변수부터는 배열의 요소들이 할당됨

초기값은 두번째 매개변수를 넣으면 지정됨

const squaredNumbers = numbers.map(function(num) {
  return num ** 2;
},0);

이렇게.

그냥 알고는 있었는데
고차함수가 뭐 콜백함수가 뭐
이름만 알았지
이런 원리로 작동하는지는 몰랐다

쓰다보니
뭔가 for문 대신 쓰면 되는건가..? 라는 생각이 들었다
아직 잘 활용하는 것이 어렵다

오늘은
새삼
동기분들이 대단하신 분들이 많다는 생각을 했다
교수님도 계시고.. 엄청난 학력을 가진분들이 너무 많음..

뭔가 부트캠프가 아니었다면
살면서 절대 말 한마디 못해볼 분들이랑
같이 수업을 듣고 뭔가 할 수 있는 기회를 받았다는게
참 운이 좋다는 생각이 든다

감사하게 생각하면서 열심히 해야겠다
화이팅,,

profile
힘을내자

0개의 댓글