[Javascript] 함수(2)

2024. 5. 9. 17:28Javascript

728x90

 

콜백함수

 

 

자신이 아닌 다른 함수에 인수로서 전달된 함수

function main(value) {
  value();
}

function sub() {
  console.log("I am sub");
}
main(sub);

 

위의 예시에서 sub 함수가 콜백함수

 

콜백함수는 메인함수가 원하는 타이밍에 실행 가능

 

 

 

 

콜백함수 예제

 

function cal1(count) {
   for (let num = 1; num <= count; num++) {
   console.log(num);
   }
};

 function cal2(count) {
   for (let num = 1; num <= count; num++ ) {
     console.log(num * 2);
   }
 };
cal1 (10);
cal2 (10);

 

위의 코드처럼 비슷한 구조를 쓰는 동작을 코딩하는 경우가 많음

계속 반복하면 중복코드 많아져서 관리도 어렵고 효율도 떨어짐 → 콜백함수를 이용하면 이 문제 해결

 

function cal(count, callback) {
  for ( let num = 1; num <= count; num++ ) {
    callback(num);
  }
}

cal1(10, function (num) {
  console.log(num);
});
cal2(10, function (num) {
  console.log(num * 2);
});
cal3(10, function (num) {
  console.log(num * 3);
});

처럼 중복코드 제거하면서 간결하게 표현 가능

 

더 간결하게 표현하고 싶으면 화살표 함수 사용하기

 

callback 함수는 실제로 많이 사용되니 잘 이해해 두자

728x90

'Javascript' 카테고리의 다른 글

[Javascript] 객체  (0) 2024.05.11
[Javascript] 스코프(범위)  (0) 2024.05.10
[Javascript] 함수(1)  (0) 2024.05.08
[Javascript] 반복문  (0) 2024.05.07
[Javascript] 조건문  (0) 2024.05.06