[JavaScript] 콜백(Callback) 함수

JavaScript에서 함수는 값으로 사용될 수 있다.

그 말은 즉, 함수가 매개변수와 인자의 값으로도 전달될 수 있다는 이야기인데, 아래 코드를 통해 자세히 들여다보자.

function sayDate(month, day, callback) {
    let wo = '오늘은 ' + month + '월 ' + day + '일 입니다.';

    callback(wo);
}

sayDate('1', '17', function (month, day) {
    console.log(month, day);
})

 

 

위 코드의 sayDate 함수는 wo라는 변수를 가지고 있다.

그리고 함수의 내부에서 wo 변수를 가지고 callback 함수를 실행시킨다.

 

마지막 줄에서 sayDate를 실행시키는데, 첫번째 두번째 인자는 각각 month와 day에 해당하는 값이고, 세번째 값은 sayDate 함수의 매개변수 callback에 해당하는 익명함수가 들어간 것을 볼 수 있다.

 

결과

 

 

위 코드를 실행한다면 sayDate의 매개변수인 month, day, callback에 각각 아래와 같은 인자들이 전달된다.

• month : 1
• day : 17
• callback : function(month, day){ console.log(month,day);}

 

 

그렇게 실행된 sayDate 함수에서는, callback(wo)에서 불러온 익명함수를 가져와 wo를 매개변수로 준다.

 

결론적으로 위와 같은 문장이 출력되게 된다.

 

 

콜백 함수는, 함수 밖에서의 다른 함수를 매개변수로 불러와 우리가 원하는 함수 내부에서 사용할 수 있도록 하는 방법이다.

예를 들어, 우리가 사용할 A함수에서 바깥의 B 함수를 호출하고 싶다면, 그냥 호출하면 에러가 난다.

그럴 때, A 함수의 매개변수로 callback 함수를 설정하고, A 함수를 호출할 때 B 함수를 인자로 전달해주면 문제없이 사용할 수 있다!