지지 On Air

JavaScript 기초 : 콜백함수(CallBack Function) 본문

개발/JavaScript

JavaScript 기초 : 콜백함수(CallBack Function)

슈스 지지 2025. 7. 29. 16:26
반응형

콜백함수 (CallBack Function)

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

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

main(sub); // sub함수를 main함수의 인수로 보냈다 == 콜백함수


// 함수 안에서 원하는 타이밍에 맞게 실행 시킬 수 있다.
function main2(fnValue){
	fnValue();
    console.log("End");
}
function sub2(){
	console.log("Start");
}

main2(sub2); 
// 콘솔창에 start end 순서로 찍힌다.


// [추가] sub2를 따로 선언하지 않고 다음과 같이 함수표현식으로 사용할 수 있다.
main2(() => {
	console.log("Start");
});

 

 

특정 횟수만큼 돌면서 어떠한 함수를 실행하는 코드를 작성한다면 다음과 같이 작성할수 있다.

function repeatFnc(cnt, callback){
	for(let idx = 1; idx <= cnt; idx++){
    	callback(idx);
    }
}

repeatFnc(5, (idx) => {
	console.log(idx * 2);
});

// repeatFnc함수의 인수로 5와, 변수*2를 하는 함수를 넘겨줬다.
// 따라서 콘솔창에는 2,4,6,8,10 이 출력된다.
반응형
Comments