Callback..
callback의 최종보스 Promise와 async등을 사용하다 작동원리가 궁금해져 callback에 대해 공부하기로 했다. callback은 말그대로 나중에 실행되는 함수를 말한다.
callback함수라고 해서 특별한 실행문이 있는 것은 아니다.
callback은 어떤 이벤트나 조건에 도달했을때 호출되는 함수이다.
콜백을 사용하는 이유는 자바스크립트를 비동기적으로 프로그래밍 한다는 것이다.
비동기적 이벤트는 웹 3세대로 넘어오면서 가장 큰 변화라고 불러도 손색이 없다.
웹에서 사용자가 사용하는 이벤트는 추측할 수 없다. 그렇기에 웹은 리얼타임으로 반응해야하고 특정 이벤트를 호출하면 발생해야 한다. 또한 서버측에 요청을 보내면 그 응답을 받는 시점이(로딩..?) 각각 다르기 때문에(네트워크환경이나, 서버속도?)이에 맞게 프론트 단에서 구현을 시켜줘야 한다. 만약 사용자가 요청한 데이터가 서버에서 웹까지 도착하는 속도가 2초가 걸린다고 가정했을때, 프론트단에서 구현한 데이터 뿌려주기 함수가 이벤트발생 후 1초만에 실행된다면 데이터가 아직 도착하지 못해 원하는 결과물을 얻어내지 못 할 것이다.
대표적인 Callback함수
1. setTimeout
setTimeout은 콜백함수의 실행을 지정시간 만큼 뒤로 미루는것이다.
사용법은 모두 알터이니 생략하고, setTimeout 함수의 일처리에 대해 말해보겠다.
setTimeout은 실행이 되면 자바스크립트 작동 프로세스중 콜백함수를 처리하는 파트로 넘어간다. 그 파트에서 시간을 미뤄주고 약속된 시간이 된 이벤트는 TaskQueue에 넘어가는데 이 TaskQueue는 동작 순서는 메인영역 > TaskQueue 순으로 실행이 되기 때문에 메인 영역에서 작업이 끝나지 않은 무한 루프에 작업이 있을경우 TaskQueue에 담긴 이벤트는 실행되지 못한다. 나중에 그림으로 그려 설명 해보겠다.
2.setInterval
setInterval도 setTimeout과 같이 콜백을 비동기적으로 호출 가능하게 해주는 함수이다.
차이점은 지정된 시간을 기준으로 반복적으로 콜백을 호출해준다는 것이다.
setInterval은 고유의 값을 리턴하고 그 리턴값을 clearInterval에 전달해주면 그 함수는 종료가 된다. setInterval의 경우 종료의 시점을 지정해 주지 않으면 무한으로 돌아 메모리에 과부화를 끼칠염려가 있기에 주의해야한다.
