오늘은 콜백함수에 대해 내용을 작성해 보려고 합니다.
콜백함수
다른 함수에 매개변수로 넘겨주는 것을 뜻함
매개변수로 함수 객체를 전달하고 호출 함수 내에 매개변수 함수를 실행
쉽게 비유로 이해하기
음식점 웨이팅을 생각하면 편합니다. 웨이팅이 있는 음식점을 가면 자리가 없어 대기자 명단을 작성합니다. 그 뒤에 연락이 오기 때문에 카페에 있거나 동네탐방을 하러 돌아다니죠. 식당에서 자리가 생기면 연락이오고 그 전화 받는 시점이 콜백함수가 호출되는 시점과 같습니다.
비동기식 동작 -> 명단을 작성하고 다른 행동을 할 수 있다.
예제
매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백함수
매개변수를 통해 콜백 함수를 전달받는 함수를 고차함수
- Callback함수의 기본 형태이며, 함수 funcA를 호출했을 때, 밑에있는 Callback함수가 실행된다. 제어권은 funcA에게 있다.
map
map은 callbackFunction을 사용해서 새로운 객체를 반환해옵니다.
익명 함수
setTimeout
자바스크립트는 동기적언어라 순차적으로 실행합니다. 이렇게 되면 성능쪽과 사용자 경험에 영향을 끼칠수 있어 비동기 처리가 등장하게 되었습니다.
비동기처리면 대표적으로 setTimeout을 들어보셨을텐데요
위에 사진과 다르게 이 사진은 1 3 2 순으로 나타나게 됩니다.
setTimeout은 정해진 시간만큼 지연시키는 내장함수이기 때문에 이렇게 나타나게 됩니다.
이 부분에 대한 자세한 내용은 이벤트 루프글을 보시면 더 이해가 잘 되실거에요!
콜백지옥
콜백지옥이란 JavaScript를 이용한 비동기 프로그래밍시 발생하는 문제, 매개변수로 넘겨지는 콜백 함수가 반복되어 코드 들여쓰기 수준이 감당하기 힘들 정도로 깊어지는 현상을 뜻합니다.
이런 형태로 등장하는데 이와 같은 코드는 가독성이 떨어지고, 코드를 수정하기 어려워진다.
이 사진은 에러처리를 넣은 코드인데 가독성이 떨어지고, 코드 수정이 어려워 집니다.
이렇게 콜백 지옥에 빠지게 되지 않게 도와주는 것이 Promise입니다.
다음 편에 Promise에 대해서 설명하겠습니다.
