[목차]

콜백 함수

지난 시간에 배웠던 함수를 기억하고 계신가요?

  1. 함수는 매개변수(parameter)를 넣을 수 있다.
  2. 함수는 값을 반환할 수 있다

함수는 javascript의 꽃이라고 불리는 이유는 함수가 정말 많은 곳에서 사용되기 때문입니다. 이때 callback(콜백) 함수의 개념만 알면 함수의 대부분은 알고 계신다고 보면 됩니다!

콜백 함수는 함수가 나중에 불린다고 해서 CallBack 함수입니다. 보통 콜백 함수를 구현할 때 함수의 인자에 함수를 넣는 방식으로 진행합니다.

//1. sayHello라는 함수가 콜백 함수로 사용되는 예시를 보여줍니다.

function sayHello(){ //sayHello 라는 함수를 만듭니다.
	console.log('수강생 여러분 안녕하세요');
}

**f**unction getHuman(callback){ //getHuman 함수의 파라미터에는 함수가 들어갑니다.
	callback(); //callback 파라미터는 함수이기에 실행시킬 수 있습니다.
}

//getHuman의 파라미터인 callbackFunc에는 sayHello가 들어가고 sayHello가 실행됩니다.
getHuman(sayHello) //'나는 그랩이다'가 출력됩니다.

<aside> 💡 [강의 후 추가 내용] 모든 함수의 파라미터 이름은 자유롭게 설정할 수 있습니다. 즉 getHuman(callback)을 getHuma(cb) 이렇게 바꿔도 됩니다.

</aside>

이렇게 콜백함수를 사용할 때 아래와 같이 함수로 정의된 변수를 넣지 않고 바로 함수를 넣을 수도 있어요. 이를 익명 함수라고 부릅니다 (이런 게 있다고만 알고 계세요)

//아래와 같은 형식으로도 사용이 가능해요. 이렇게 많이 사용되니까 꼭 알아두면 좋습니다. 
//함수의 이름을 붙여서 선언하지 않고 1회용으로 사용되는 함수를 만듭니다.
getHuman(function(){
	console.log('나는 그랩이다.')
})

<aside> 💡 [강의 후 추가 내용]

  1. getHuman안에 있는 익명함수는 실제로 코드가 실행될 때 위에서 선언한 callback이라는 파라미터에 들어가게 됩니다.

  2. 만약 getHuman(1) 이렇게 넣으면 어떻게 될까요? 1은 int형이고 실제로 1() 이렇게 실행할 수 없습니다. 그렇기에 에러가 날 겁니다.

</aside>