콜백함수 (Callback function)

어떠한 함수가 수신하는 인자가 함수일 경우를 말한다.

array.sort(sortFunc);

내장객체(내장메소드,빌트인객체,빌트인메소드)인 sort는 인자값으로 function을 받는다.

var numbers = [20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];
var sortfunc = function(a, b){
    //console.log(a, b);
    if(a > b){
        return 1;
    }else if (a < b){
        return -1;
    }else {
        return 0;
    }
}
console.log(numbers.sort(sortfunc));

var numbers = [20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];
var sortfunc = function(a, b){
    //console.log(a, b);
    return a - b
}
console.log(numbers.sort(sortfunc));

양수, 음수, 0을 한번에 정리 여기서 sortfunc가 콜백이 된다. sort 메서드의 동작방법에 영향을 끼친다.

오리지널 함수 동작방법을 값으로 전달한 함수를 통해 완전히 바꿀 수 있다.

비동기 처리에서의 Callback

일단, 비동기 처리란 무엇인가? 상상하자

내가 글을 쓰면 만명의 구독자에게 메일이 간다. 글작성 -> 이메일발송 -> 작성완료 가 포인트 이메일발송을 만명의 구독자에게 보낸다고 3시간이 걸린다 치자, 이 과정을 순차적으로 진행한 동기적 처리라 한다.

글작성 -> 이메일발송예약 -> 작성완료 발송 예약이라는 변경으로 인하여 작성완료페이지를 볼 수 있고, 다 끝난거 같지만 백그라운드에서 3시간을 처리 todo 같은거라 할 수 있다. 그 일을 지금처리 할 수 없지만 나중에는 처리해야하는 일 이런일을 비동기적인 처리라 한다.

페이지내에서 장바구니 창이라던지 등 페이지 url이 변경되지 않고 작은 박스가 뜨는 경우 웹브라우저와 서버가 조용히 일을 하는거다. 이러한 기법을 Ajax라 부른다.

Ajax를 통해 웹이 단순히 문서가 아닌 웹애플리케이션 역할을 하게 되었다.

이러한 Ajax요청일은 페이지를 얼리지않고 계속 서버와 통신하는 와중에도 다른 활동(스크롤이라던지)까지 같이 할 수 있게 한다.

$.get('./datasource.json.js',function(result){
  console.log(result);  
},'json');

(Jquery 라이브러리 사용)

.get('url',함수) 이라는 메소드는 첫번째 인자로 url를 받고, 두번째인자로는 함수로 서버와 통신이 끝났을 때 호출되도록 약속된 것.

첫번째 인자로 서버와 통신하는건 get 메소드를 쓰면서 동일하지만, 두번째인자를 통해 그 동작방법을 완전히 바꿔놓을 수 있는건 콜백함수가 있기 때문에 가능하다.