Front-End/JavaScript

[자바스크립트] 콜백함수(Callback Function)

챌링킴 2021. 6. 20. 17:11
반응형

1) 콜백함수(Callback Function)

- 파라미터로 함수를 전달받아 함수의 내부에서 실행하는 함수

 

2) 콜백함수(Callback Function) 문법

 

        const num = [1,2,3,4,5];

        num.forEach(x => {
            console.log(x * 10);
        });

        console.log('💛아래위 동일한 실행문💛');

        num.forEach(function(x) {
        console.log(x * 10);
        });
▼결과값▼
10
20
30
40
50

 

3) 콜백함수(Callback Function) 예제1

 

        function setUserid(userid,callback){
            console.log(`userid : ${userid}`);
            callback();
        }

        function finish(){
            console.log('finish function!');
        }

        setUserid('apple',finish);
▼콘솔창 결과▼
userid : apple
finish function!

 

4) 콜백함수(Callback Function) 예제2

 

        const userid = 'apple'; //전역변수
        function callbackFunc(callback){
            let name = '반하나'; //지역변수
            callback(name);
        }

        function userinfo(name){
            console.log(`userid : ${userid}, name : ${name}`);
        }

        callbackFunc(userinfo);
▼콘솔창 결과▼
userid : apple, name : 반하나


1. 매개값 userinfo를 callbackFunc의 매개변수 callback에 넣는다.
2. userinfo의 name 매개변수에 callbackFunc의 지역변수 name의 값을 넣는다.
3. userinfo의 userid 변수는 전역변수인 'apple'이 담겨있다.
반응형