비동기처리란?

비동기처리란?

프로그램이 특정작업을 동기적으로 처리하지 않고,

해당 작업이 완료될 때 까지 기다리지 않고 다른 작업을 수행할 수 있는 프로그래밍 패러다임을 의미합니다.

I/O작업, 네트워크 통신, 데이터베이스 조회와 같이 시간이 소요되는 작업을 효율적으로 처리하기 위해 사용됩니다.

위와 같은 작업을 동기적으로 처리할 경우 전체 프로그램이 대기상태에 빠질수가 있습니다.

그렇기 때문에 비동기 처리를 통해 다른작업을 수행하면서도 효율적으로 대응할 수 있습니다.

특정 로직의 실행이 끝날 때 까지 기다려주지 않고 나머지 코드를 먼저 실행하는 것을 비동기 처리라고 합니다.

JavaScript에서의 비동기처리는 settime함수, 이벤트처리, AJAX요청과 같은 경우에 주로 사용됩니다.

 

 

---

 

 

콜백함수

비동기 작업이 완료되면 호출되는 함수입니다.

console.log("안녕");
setTimeout(function() {
    console.log("하세요");
}, 2000);
console.log("반가워요");

라는 setTimeout함수를 사용하여 콜백함수를 전달하면 결과는

코드는 위에서 아래로 진행이 되는게 맞기 때문에

"안녕" "하세요" "반가워요"

순서로 출력이 되야하지만 비동기 작업을 사용하였으므로 비동기적으로 2초후에 "하세요"를 출력하는 작업이 예약되고

다음코드로 바로 진행되기 떄문에 "안녕 반가워요" 가 나오고 "하세요"가 출력되는 것입니다.

 

 

---

 

Promise

Promise는 비동기  처리의 추상화를 제공하는 객체 입니다.

비동기 작업이 성공 또는 실패할 경우 처리할 콜백 함수를 등록할수있습니다.

(네트워크 요청, 파일 읽기, 데이터베이스 쿼리작업)

여러 비동기 작업의 동시제어를 수행합니다.

콜백지옥을 방지합니다.

즉, Promise는 비동기 코드를 관리하고 처리할 때 유용하며,

코드의 가독성을 향상시키고 복잡한 비동기 작업을 더 효율적으로 다룰수 있도록 도와줍니다.

console.log("안녕");

let promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve("하세요"), 2000);
});

promise.then((result) => {
    console.log(result);
});

console.log("반가워요");

 

 

---

 

Async / Await

Promise를 기반으로 한 문법적인 편의를 제공합니다.

비동기 함수 내에서 동기적인 코드처럼 작성할수 있습니다.

Async 함수 내에서 await키워드를 사용하면 비동기 작업이 완료 될 때까지 기다린후 실행합니다.

async function example() {
    console.log("안녕");

    function delay(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    await delay(2000);
    console.log("하세요");

    console.log("반가워요");
}

example();

비동기 작업이 완료될 때 까지 기다린후에 작동하므로 "안녕"이 출력되고 2초를 기다린 뒤

그 밑의 작업들이 실행된것을 볼수 있습니다.