Async function

AsyncFunction 객체를 반환하는 하나의 비동기 함수를 정의합니다.

 

 

  • Syntax
async function name([param[, param[, ... param]]]) {
        statements
}

 

  • Description

async 함수에는 await 식이 포함될 수 있습니다. ( await 키워드는 async 함수에만 유효함 )

await 식은

1) async 함수의 실행을 일시 중지하고

2) 전달 된 Promise 의 해결을 기다린 다음

3) async 함수의 실행을 다시 시작하고

4) 완료 후 값을 반환합니다.

 

Note

- async/await 함수의 목적은 사용하는 여러 Promise 의 동작을 동기스럽게 사용할 수 있게 하고,
어떤 동작을 여러 Promise 의 그룹에서 간단하게 동작하게 하는 것입니다.

- async 함수는 항상 Promise 를 반환합니다. 만약 반환값이 명시적으로 Promise 가 아니라면
  암묵적으로 Promise 로 감싸집니다.
  아래의 코드를 예시로 볼 수 있습니다.
async function foo() {
        return 1
}

function foo() {
        return Promise.resolve(1)
}


 

 

비동기 함수

이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise 를 사용하여 결과를 반환합니다.

 

 

 

Promise

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과값을 나타냅니다.

 

기본적으로 promise 는 함수에 콜백을 전달하는 대신에, 콜백을 첨부하는 방식입니다.

 

예를 들어, createAudioFileAsync() 라는 함수가 있다고 생각해보겠습니다.

 

해당 함수는 [ 음성 설정에 대한 정보 ] 를 받고, [ 두 가지 콜백 함수 ] 를 받습니다.

 

1) 음성 파일이 성공적으로 생성됬을 때, 실행되는 콜백

2) 에러가 발생했을 때 실행되는 콜백

 

function successCallback(result) {
  console.log("Audio file ready at URL: " + result);
}

function failureCallback(error) {
  console.log("Error generating audio file: " + error);
}

createAudioFileAsync(audioSettings, successCallback, failureCallback);

 

만약 createAudioFileAsync () 함수가 Promise 를 반환하도록 수정한다면, 다음과 같이 사용할 수 있습니다.

 

createAudioFileAsync(audioSettings).then(successCallback, failureCallback);

// or

const promise = createAudioFileAsync(audioSettings);
promise.then(successCallback, failureCallback);

 

이러한 방식을 비동기 함수 호출이라고 부릅니다.

 

 

'HTML-CSS-JS' 카테고리의 다른 글

JavaScript 요약 강좌2  (0) 2022.08.16
JavaScript 요약강좌1  (0) 2022.08.16
Form 태그의 이해  (0) 2022.07.02

+ Recent posts