코드 스테이츠 5일차(JS/NODE[고차함수])

Lumi·2021년 9월 3일
0
post-thumbnail

고차함수 이해하기

목표

  • 일급 객체의 세가지 특징
  • 고차함수에 대해 설명
  • 고차함수를 JS로 작성

1. 고차 함수

변수에 함수를 할당 할수가 있는데 = 함수 선언식

이런식으로 변수에 직접 함수를 지정하는 것이다.

하지만 이렇게 선언하는 함수는 다른 변수, 호이스팅이 적용되지 않는다는 단점이 있다.

호이스팅 : 선언된 위치에 관계없이 어디서든 함수를 사용할수 있게 한다.

사실 호이스팅인 부분을 제외하면 함수 선언식, 표현식의 차이는 없다고 볼수가 있다.

고차함수

  • 함수를 인자로 받을 수 있고, 함수의 형태로 리턴할수 있는 함수

다른함수의 인자로 전달되는 함수 - 콜백 함수
함수를 리턴하는 함수 - 커리함수

이 두개를 합쳐서 고차 함수 라고 한다.

  • 쉽게 설명하면 콜백함수는 이용되는 함수

  • 이런것을 커리 함수 라고 한다.
  • 이런 로직을 조합하여 커리함수 + 콜백함수를 합쳐서 사용할수도 있다.

내장 고자함수 이해하기

목표

  • 배열 내장 고차 함수 filter에 대해서 이해
  • filter에 대한 이해를 기반으로 나머지 고차함수 이해

    forEach, find, filter, map, reduce, sort, some, every

  • 추상화에 대한 이해
  • 고차함수를 이용한 프로그램

filter

  • 배열메소드중 하나
  • 모든 배열의 요소중에서 특정 조건을 만족하는 요소만을 걸러내는 메소드
  • 의미만을 전달하기 위해서 작성한 코드이다.

    실제로 저렇게 작동하지는 않는다.

걸러내는 기준이 되는 특정 조건을 filter메소드의 인자로 전달이 되며 이떄 전달되는 조건은 함수의 형태이다.

filter메소드에 전달되는 인자=매개변수는 함수의 형태를 띈다고 설명을 하였고
적용되는 배열의 index를 하나하나 확인을 하여 true라면 return 하고 false라며 return하지 않는다.

  • 코드를 상세하게 설명을 하자면

    filterExample는 들어오는 값이 짝수이면 true, 홀수이면 false를 반환하는 함수이다.

이 함수를 활용하여 filter에 인자로 넣어주게 되면
arr의 index값 [1,2,3,4]를 자동으로 하나하나 검색을 하고 true면 통과 false면 통과시키지 않는다.

1%2 = x
2%2 = 0
3%2 = x
4%2 = 0

이렇게 되어서 짝수인 2,4가 return 되는 것이다.

  • 중요한점은 filter내부에서 자동으로 for문을 돌려서 배열을 검색한다는 점이다.

용어를 수정하겠다. index는 배열의 value위치를 말한다.
-> 예시로든 arr을 보면 1의 위치는 1 index, 2는 2 index로 말한다. 그러기 값을 말하는 표현은 value로 정정

forEach

  • 배열의 요소를 하나하나 따오는? 것이다.

    지정한 변수(e)에 배열의 value값을 바당온다.

JAVA에서 forEach문과 똑같다.

find

  • filter과 마찬가지고 함수를 인자로 받는다.

  • filter와 거의 동일하게 사용된다.

차이점이 있다면 filter는 forEach처럼 모든 배열을 확인하지만 find메서드는 함수에 맞는 value값을 찾으면 그 즉시 실행을 중지한다.

  • 하나의 값만 return한다.

map

  • forEach와 비슷하다고 할수가 있다.
  • 변수 v에 arr의 value값을 하나담고 작업 -> 다음 value를 담고 작업을 반복한다.
  • 함수로 인자를 넣어도 된다.

reduce

  • 아마 가장 어려운 함수이지 않을까 싶다.
  • 가독성을 위해 한글로 작성을 하였다.

마지막에 0은 누적값의 초기값을 지정해 주는 값이다.

  • -> 0으로 지정하지 않으면 누적값의 처음값은 현재값이 된다.

return해서 반환되는 값은 누적값에 쌓이게 된다.

sort

  • 참 단순한 메서드 이다.

코드만 봐도 알수가 있다.
기본적으로 정렬의 역할을 하는것은 똑같지만 맨 앞자리 수만을 비교하여 정렬을 실행한다.

이를 수정하기 위해서는 함수를 이용하여 값을 비교하는 작업이 필요하다.

  • sort또한 배열의 모든 값을 확인하며 진행된다.

  • 이렇게 함수로 a,b를 지정하면 a에는 현재 index값
    b에는 다음 index값이 저장이 된다.
  • 이런 점을 보면 JS는 정말 단순하고 멍청한 언어 같기도 하지만 너무 편리하다는 장점도 있는거 같다.

나도 정확하게는 어떻게 작동이 이루어 지는지는 모르겠다..

java같은 경우에는 for문을 돌리게 되면 로직이 어떻게 구현이 되는지 알수가 있는데 js는 이런 부분에서 좀 안타깝다.

some, every

  • 배열을 forEach와 같이 돌아보며 true false를 반환하는 메서드

every는 &&와 비슷하고
some는 || 와 동일하다.

  • 코드를 보면 알수 있듯이

some는 로직에서 false가 나와도 하나라도 true라면 true를 반환하지만

every는 모두 true가 아닌이상은 false를 반환한다.

====================================================================

  • 고차 함수 부분은 코플릿을 풀면서 실제로 연습을 하는게 도움이 될꺼같다.
  • 기본 적인 개념은 여기까지가 끝이며 이것을 다양하게 활용을 함으로써 코드의 추상화를 이룰수가 있다.
profile
[기술 블로그가 아닌 하루하루 기록용 블로그]

1개의 댓글

comment-user-thumbnail
2021년 10월 27일

이번에 BEB 2기 합격해서 예습중인데 엄청 도움되네요 감사합니다 잘보고있어요

답글 달기