동기, 비동기, Callback함수
JavaScript
2022년 12월 5일
목차
🤔 동기와 비동기?
동기식 : 어떤 함수를 결과가 끝날때까지 기다린 후 다음 부분 실행 (일반적인 실행 경로)
비동기식 : 어떤 함수를 호출 후 바로 다음으로 넘어감, 실제로 코딩한 순서와 다르게 동작하는 코드
↪️ Callback 함수
정의 : 함수에 파라미터로 들어가는 함수
용도 : 순차적으로 실행하고 싶을 때 사용
대표적인 예로 함수를 파라미터로 받는 addEventListener()
와 setTimeout()
등이 있다.
그렇다면 정의되어 있는 함수 말고 사용자가 함수안에 함수를 넣는 콜백함수를 사용하려면 어떻게 해야할까?
function first(parameter){
parameter(); // 파라미터가 함수
}
first (function(){}); // 사용할 때는 이렇게
말 그대로 함수 안에 함수를 넣어놓으면 된다
좀 더 용도(순차적으로 실행)를 살린 코드 예시를 보면
function first(parameter){
console.log(1);
parameter();
}
function second(){
console.log(2);
}
first(second);
- 실행결과는
1 ('/n') 2
이렇게 first 함수를 여러 번 사용한다는 가정 하에 그 뒤에 다른 기능을 순차적으로 넣고 싶다면 callback 함수를 활용하면 된다.