본문 바로가기

Javascript

callback함수를 적용해보기!

callback 함수를 이해했는지 확인하는 작업.

문제: 나이가 3 초과인 사람은 통과하고 아니면 입장할 수 없다라는 콜백함수 만들기.


원리 : 단일 쓰레드인 js엔진은 실행할 수 있는 공간이 한 곳인데(콜스택)입니다. 먼저 main함수가 실행되고 조건에 맞춰서 console.log가 실행이 되거나 되지 않은 상태(age<3) 로 함수가 종료되고 동시에 callback함수는 webAPI가 처리할 수 있게 js엔진이 요청한다. webAPI는 이를 가지고 q에 옮겨놓고 이벤트 q의 순서에 따라 콜스택이 비게 되면 그 위에 콜백함수를 실행하게 된다. 

 

function check(age,callback){
			age>3? console.log("통과입니다"): callback()
}


function errorcheck(age){


		setTimeout(() => {
			console.log("나이가 3보다 작기 때문에 서버 요청에 실패하였습니다.")
		}, 1000);
	

}

check(7,errorcheck)
check(2,errorcheck)

결과


통과입니다
나이가 3보다 작기 때문에 서버 요청에 실패하였습니다.

문제2: 웹 API에 url의 데이터가 정상적으로 들어온 데이터만 함수 실행 하기 

 


let url = "https://www.youtube.com/"

function download(url,check ){

    setTimeout(() =>{

    console.log(`${url}의 데이터를 다운로드 중입니다` )

        let error = url.length===0 

        error ? function check(){console.log('error')} : console.log("데이터가 잘 들어왔습니다")


},3000)


}