JavaScript - 고차함수에 대하여

안녕하세요.

Hynn 입니다.

 

이번 포스팅에서는 고차함수 (Higher-Order-Function) 에 대해서 포스팅해보도록 하겠습니다.

더블어 다음 포스팅에서는 고차함수에 적용되는 Method 까지 하여, 2개의 포스팅으로 나누어 작성할 예정입니다.

 

==========

1. 고차함수란 ?

2. 퍼스트클래스 함수

3. 고차함수 작성예제 

==========

1. 고차함수란 ?

고차함수(Higher-Order-Function) 은, 함수를 인자값으로 받거나, 함수를 반환하므로써, 작동하는 함수를 말합니다. 즉 함수를 작성했는데, 인자값이 함수이거나, return 값이 함수인 것을 뜻합니다.

이는 코드작성시에 조금 더 간결하게 작성할 수 있고, 결과물 자체에도 함수가 적용되므로, 적용된 값만 변경이 되면, 출력도 그에 맞게 변경되는 장점이 있을 수 있습니다. 

이를 위해서는 퍼스트클래스 함수라는 단어를 먼저 이해해야 합니다.

 

2. 퍼스트클래스 함수

 

퍼스트클래스 함수(First-Class Function) 는 함수를 다른 변수와 동일하게 다루는 언어는 "일급 함수"를 가졌다고 표현할 때 사용됩니다. 이 퍼스트클래스 함수는, 함수를 다른 함수에 인자로 제공하거나, 함수가 함수를 반환할 수 도 있고, 변수에도 할당할 수 있습니다.

 

예를 들어 간단하게 일급함수(First-Class Function) 함수를 작성해보면 아래와 같은 예시가 될 수 있습니다.

 

const Soccer = function (){
	console.log("Football")
}

Soccer()

위의 예시를 보면, 작성자는 Soccer 라는 변수를 선언하고, 이 변수에 익명함수를 할당했습니다. 그리고 그 함수에는 Console.log("Football") 을 출력하도록 변수에 선언하였습니다.

 

그리고 Soccer 라는 변수를 () 기호를 사용하여 함수를 호출하였습니다.

이를  일급 함수라고 표현합니다.  하지만 여기서는 이전에 다루었던 개념도 존재합니다.

바로 Callback 함수입니다.

 

Callback 함수의 개념은, 함수에 인자로 전달된 함수를 뜻합니다. 즉 아래의 예시처럼 작성을 해볼 수 있습니다.

 

function Hynn(count, cons, arr) {
    count < 3 ? cons() : arr()
  }
  
  function Linka() {
    console.log('안녕하세요');
    console.log('hynn.tistory.com')
  }
  
  function HynnName() {
    console.log('개인공간에 오신것을 환영합니다')
  }
  
  Hynn(2, Linka, HynnName)

 

위의 함수 구성을 보면, 각각의 3개의 함수를 작성했습니다. Hynn, Linka, HynnName 이 그것입니다.

여기서 Hynn 이라는 함수를 호출하고, 인자에 2, Linka, HynnName 이라는 인자를 전달했습니다. 여기서 2가 아닌 Linka, HynnName 은 함수입니다. 

 

즉, Hynn 이라는 함수에 인자로 2 외에도, Linka, HynnName 이라는 두개의 함수가 인자값으로 전달이 된 이 경우에는 "Callback Function, 콜백함수" 라고 합니다.

 

하지만 이러한 개념 외에도, JavaScript 에서는 함수를 "변수"와 동일하게 취급하고 있습니다. 그래서 "Return" , 즉 반환하는 값에도 함수를 넣을 수 있습니다. 이를 "고차 함수" 라고 합니다.

 

즉 정리하면 아래와 같습니다.

유형	설명
First-Class Function	변수에 함수를 할당합니다.
Callback Function	함수를 인자값으로 전달합니다.
Higher Order Function	함수로 반환합니다.

하나의 예제문을 가지고 이를 나누어 보도록 하겠습니다.

 

const Hynn = function (){
    return function (){
        console.log('Hynn.tistory.com')
    }
  }

  const Blog = Hynn()

먼저 위 내용만 가지고 판단했을때 , 이 선언들은 First-Class Function, 즉 일급 함수에 해당합니다. 각각의 Hynn, Blog 라는 변수에 함수를 할당했기 때문입니다. 

여기서 Callback 함수로 이를 바꾼다면, 아래와 같이 될 것입니다. 

 

const Hynn = function (value){
    return function (){
        console.log('Hynn.tistory.com')
    }
  }

const Blog = Hynn()
const Linka = function (value, Hynn, Blog){
    console.log (value < 3 ? Hynn () : Blog())
  }

Linka(1,Hynn,Blog)

 

위의 예시처럼 함수에 1 이라는 인자값을 전달하여 함수를 호출했습니다. 

여기서 고차함수로 변환한다면 아래와 같이 변경할 수도 있습니다.

const Hynn = function (value){
    return function (){
        console.log('Hynn.tistory.com')
    }
  }

const Blog = Hynn()
Blog()

즉, 고차함수의 최종적인 개념은 "함수를 인자로 받고" , "함수를 반환" 할 수 있는 함수입니다.

이를 더 쉽게 이해한다면, 다 같은 함수이지만, 함수 중에서 함수를 인자로 받고 함수를 반환하는 함수를 특정하게 "고차 함수" 라고 부르는 것이죠.

 

근본적으로는 함수임은 변하지 않는 사실입니다.

이미 인지하고 있지 않은 상태에서도 사용하실 수 있는 기능이기 때문에, 이러한 개념에 대한 정리가 필요할 것이라고 생각됩니다.

다음 포스팅에서는 고차함수에 적용되는 Array Method 에 대해서 알아보도록 하겠습니다.

 

감사합니다.