JavaScript Callback Function (콜백함수)

콜백함수란? 

- 콜백(callback)이란 옵저버(Observer) 디자인 패턴에서 나온 개념

- 객체의 상태변화(이벤트)가 발생했을 경우에 이러한 사실을 함수를 통해 전달하게 되는데, 이를 콜백함수라 한다.

- 즉, 특정 함수에 매개변수로 전달된 함수가 콜백함수이다.

 

JavaScript 에서의 콜백함수

- JavaScript 에서 함수는 1급 객체이므로, 파라미터로 함수를 전달할 수 있기 때문에 콜백함수가 가능

 

콜백함수는 클로저다

- 콜백함수는 자신이 포함된 함수의 환경에 접근이 가능하다.

- 클로저는 함수가 선언될 때의 환경을 기억하고 있으므로, 콜백함수는 클로저라고 할 수 있다.

 

콜백함수의 this

- 콜백함수를 사용할 때는 this 객체에 유의해야 한다.

var obj = { name: "victolee", email: "empty",   setEmail : function(email){ this.email = email; } }   function callback(email, cb){ cb(email); }   callback("example.com", obj.setEmail); console.log(obj.email); console.log(window.email);

 

 

콜백지옥 (Callback Hell)

- 비동기 처리 로직을 동기식으로 사용하기 위해 콜백 함수를 연속해서 사용할 때 발생하는 문제

- 가독성이 떨어지고 로직을 변경하기 어려워진다.

콜백 지옥 예제