[JS] Callback함수

·2023년 1월 27일
0

⚡ Callback함수가 무엇일까


콜백함수(Callback Function)이란 함수 안에서 실행하는 함수라는 의미를 갖고있다. 이게 무슨 소리인가 하면 우리가 함수를 실행할때 파라미터 값으로 함수를 사용한다는 것이다.

단순한 코드로 한번 이해를 해보자

function plus(callback, arr) {
  let emptyArr = [];
  
  for (let i = 0; i < arr.length; i++) {
    emptyArr.push(callback(arr[i]));
  }
  
  return emptyArr;
}

plus( function(data){ return data + "a" }, ["a", "b", "c", "d", "e"] )

// output
// ["aa", "ba", "ca", "da", "ea"]

위와 같은 코드가 있다고 생각해보자. 함수를 실행시킬때 우리가 인자로 함수와 배열을 넣었다. 그럼 함수가 실행될때 전달받은 인자를 파라미터 값으로 이용하는데, 이때 인자로 함수를 넣었으니, 함수를 끌어다 쓰게 되는 것이다.

함수 안에서, 함수를 실행시키는 방식은 똑같다. 함수와 필요한 인자를 넣어주고 실행문을 써주면 끝. 이처럼 함수 안에서 함수를 실행시키는 형식을 우리는 콜백함수라고 부를 수 있다.

한편 콜백함수는 위와 같은 방식으로만 쓰이는 것은 아니다.

콜백함수는 다음과 같은 상황에서도 쓰일 수 있다. 바로 어떤 동작을 한 후에 실행되기를 원할때 우리는 콜백함수를 쓸 수 있다.

그럼 콜백함수를 왜 굳이 쓰냐는 의문이 들 수 있다. 그건 바로 나눠쓸 수 있기 때문이다. 특정 일을 하는 함수에서 인자값으로 다른 함수를 받음으로써 우리는 좀더 다양한 일 처리를 할 수 있게 된다. 가령 코드의 재활용이 가능해지는 것이다.

다만 콜백함수를 무수히 사용하게 되면, 비동기 호출이 자주일어나는 프로그램의 경우 흔히 말하는 콜백지옥에 빠질 수도 있고 나중에 디버깅이 힘들어지기에 필요할 때 사용하는게 제일 좋다.

콜백함수를 사용하는데 원칙이 몇가지 있는데 그것을 알아보도록 해보자.

익명함수 사용 : 콜백함수는 이름이 없는 익명 함수를 사용한다. 내부에서 실행되기에 이름이 별도로 필요하지 않다.

콜백함수의 파라미터 : 전역변수와 지역변수를 콜백함수의 파라미터로 전달한다.

이처럼 필요한 순간에 적절하게 코드를 재활용할 수도 있고, 지연시켜서 원하는 타이밍에 함수를 실행 시킬 수 있는 콜백 함수를 이용하면 다채로운 코드에 도전해 볼 수 있을 것 같다.



참고자료
https://inpa.tistory.com/entry/JS-%F0%9F%93%9A-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98

https://joshua1988.github.io/web-development/javascript/javascript-asynchronous-operation/

profile
뉴비는 문서화를 습관화 해보자

0개의 댓글