[JavaScript] 콜백함수 (Callback Function)

콜백이란 단어 자체의 뜻은 "다시 연락하다" 라는 의미를 가진다.
이것을 프로그래밍적으로 재해석한다면 "다른 함수가 실행을 끝내고 다시 연락해서 실행되는 함수" 라고 할 수 있겠다.

정확히는 다른 함수의 인자로 전달되어 실행되는 함수라고 이해해야한다

간단한 콜백함수 예제

function greet(name, callback) {
    console.log("Hello, " + name + "!");
    callback();
}

function sayGoodbye() {
    console.log("Goodbye!");
}

greet("Alice", sayGoodbye);

// 위 코드를 실행하면 다음과 같은 결과를 출력한다
Hello, Alice!
Goodbye!

함수 구간 별로 따져보며 콜백함수를 이해해보자.

---

function greet(name, callback) {
    console.log("Hello, " + name + "!");
    callback(); // 전달받은 콜백 함수 실행
}

greet 함수는 name, callback. 즉 두 개의 매개변수를 받고 있다
name은 이름을 출력할 문자열이고, callback은 콜백함수로 실행될 함수를 의미한다.
console.log로 인사 메세지를 출력한 뒤에, callback(); 을 통해 콜백 함수를 실행한다.

---

function sayGoodbye() {
    console.log("Goodbye!");
}

이 함수는 console.log 출력문만 담은 함수이다. 이 예제에서는 greet 함수의 콜백으로 사용되기 위해 작성되었다.

---

greet("Alice", sayGoodbye);

최종적으로 greet 함수의 name 매개변수에 "Alice" 라는 문자열을, callback 이라는 매개변수에 "sayGoodbye" 라는 함수를 전달한다.

=> "Hello, Alice!" 출력 -> callback(); 이 실행 -> sayGoodbye() 호출 -> "Goodbye!" 출력

---

콜백 패턴은 비동기 처리, 이벤트 핸들링, 비동기 HTTP 요청과 같은 동작에 자주 사용되며, 특정 작업이 끝난 후 실행할 동작을 지정하는 데에 유용하게 사용된다.