callback
콜백함수는 간단하게 다른 함수에 매개변수로 넘겨준 함수를 말한다.
매개변수로 넘겨받은 함수는 일단 넘겨받고, 때가 되면 나중에 호출(called back)한다는 것이 콜백함수의 개념이다.
function aaa(qqq){
// 함수 로직
}
aaa(function(){})위와 같은 코드에서, aaa 함수의 인자에 들어가는 function(qqq){}를 callback 함수라고 부릅니다. 인자에 함수가 들어가면 콜백함수!
aaa(function(){})
aaa(() => {}) // setTimeOut , map 방식이 떠오르네요~! 이것을 콜백함수라고 부릅니다.이 function 안에서는 함수도 실행할 수 있습니다.
현재 async, await 즉, 비동기방식처리가 없을때 많이 사용했다고 하는데
map setTimeout아 3초뒤에 이 함수를 실행시켜줘!
function aaa(qqq){
// 외부 API에 데이터 요청하는 로직
// ...
// ...
// 요청 끝!
const result = "data 값"
qqq(result) // 요청 끝나면 qqq 실행시키기
}
aaa(result) => {
console.log("요청이 끝났습니다.")
console.log("요청으로 받아온 데이터는" + result + "입니다")
}aaa한테 너 API 요청하는 함수지? result라는 콜백함수 넘겨줄테니까 실행시켜줘~ 그러면 이 함수는 qqq에게 들어가고 aaa가 외부 API요청하고 그 결과로 qqq를 실행하고 qqq인자에 result를 넣어주고 콜백함수에는 그 data가 들어옵니다. = API 요청 끝나고 실행시켜줄 방법이 없었기 때문에 이렇게 했다라고 하네요 ㅎㅎ
- js에서 함수는 object라고 합니다.
- 함수는 다른 함수의 인자로 쓰일 수도 어떤 함수에 의해 리턴될 수도 있고 이런 함수를 고차 함수라고 합니다.
- 인자로 넘겨지는 함수 = 콜백함수
중첩함수가 외부함수를 돕는 헬퍼 함수의 역할을 하는 것처럼 콜백함수도 고차함수에 전달되어 헬퍼함수의 역할을 한다.
단, 중첩함수는 고정되어 있어서 교체하기 곤란하지만 콜백함수는 함수 외부에서 고차함수 내부로 주입하기 때문에 자유롭게 교체할 수 있다는 장점이 있다.
즉, 고차함수는 콜백함수를 자신의 일부분으로 합성한다라고 딥다이브 책에 쓰여져 있습니다.
비동기 방식으로 작성된 함수를 동기방식으로 돌리기 위해서도 사용되고 가독성이나 코드 재사용면에서도 좋기 때문에 많이 사용됩니다.
참고로 저는 async/await을 이용하고 있습니다.
뭐 많게는 promise, promiall 등등이 있겠지만 모든걸 보완해서 나온게 현재 async/await이라고 하네요 ㅎㅎ
