[JavaScript] - 비동기(Asynchronous) async와 await

 

 

self.Grid_1.read().then(function () {
    enableButtons();
});

 

주어진 코드는 JavaScript에서 Promise 객체를 사용하는 예시이다. 이 코드는 'Gird_1' 이라는 객체에 대해 read( ) 메서드를 호출하고, 해당 메서드가 완료된 후 enableButtons( )함수를 호출한다.

이러한 코드는 비동기 작업을 처리할 때 사용된다. 

 

그렇다면 위 코드를 동기로 바꾸려면 어떻게 할까?

async function readGridAndEnableButtons() {
    await self.Grid_1.read();
    enableButtons();
}
 
readGridAndEnableButtons();

 

주어진 코드를 await과 async을 사용해 리팩터링하려면 함수를 async 함수로 정의하고, await 키워드를 사용해 비동기 작업을 기다려야한다. 이렇게하면 코드가 더 명확하고 간결해질 수 있다.

await 키워드는 read( ) 메서드가 완료될 때까지 기다린다. 그리고 read( ) 메서드가 완료되면 enableButtons( ) 함수가 호출된다. 

 

async와  await는 프로미스 사용을 극적으로 단순화하여 프로미스 기반의 비동기 코드를 동기 코드처럼 작성할 수 있게한다.

 

await은 프로미스를 받아 반환 값이나 예외로 바꾼다.

프로미스 객체 x가 있을 때 표현식 await x는 x가 완료할 때 까지 대기한다.

x가 이행되면 await x의 값은 x가 이행된 값이다.

 

await은 프로그램 흐름을 차단하지 않으며,

지정된 프로미스가 완료되기 전에는 '아무런 행동도 취하지 않는다.' 라는 점이다.

await을 사용하는 코드는 항상 비동기적이라는 점을 명심하자.

 

async함수

await을 사용하는 코드는 항상 비동기적이므로 중요한 규칙이 존재한다.

await 키워드는 async 키워드로 선언된 함수 안에서만 사용할 수 있다.

함수를 async로 선언하면 반환값은 무조건 프로미스이다.