자바스크립트 동기 VS 비동기

자바스크립트의 작업 수행방식

자바스크립트는 코드가 작성된 순서대로 작업을 처리한다. 이전 작업이 진행 중 일 때는 다음 작업을 수행하지 않고 기다림 즉,블로킹이 걸린 방식이다.

자바나 C++는 쓰레드를 여러개를 사용하는 방식인 작업 분할이 가능하다. 즉, 오래걸리는 일이 있어도 다른 thread에게 지시하면 된다. but 자바스크립트는 싱글스레드이다.

동기적 실행

자바스크립트의 싱글스레드 한 줄씩 실행 작업 수행 방식

console.log('helloworld');
console.log('what's up people');// 동기적 실행
            

비동기적 실행

function taskA(a,b,cb){
    setTimeout(()=>{
        const res  =  a + b;
        cb(res);
    },3000);
   
        // console.log('A 작업 끝');
}

function taskB(a,b,cb){
    setTimeout(()=>{
        const res  =  a * b;
        cb(res);
    },1000);
   
        // console.log('A 작업 끝');
}

function taskC(a,cb){
    setTimeout(()=>{
        const res  =  a *  -1;
        cb(res);
    },2000);
   
        // console.log('A 작업 끝');
}

taskA(3,4 , (res)=>{console.log('A Task Result :',res);});
    taskB(5,5,(res)=>{console.log('B Task Result :',res);});
    taskC(14,(res)=>{console.log('C Task Result :',res);});
    console.log('코드 끝');

taskA(4,5,(a_res)=>{
    console.log('A result:',a_res);
    taskB(a_res,10,(b_res)=>{
        console.log('B result',b_res);
        taskC(b_res,(c_res)=>{
            console.log('C result',c_res);
        });
    });
});

callbacak hell

콜백 함수를 활용하여 메인 함수가 종료 되면 콜백함수를 호출한다.