async funtion (함수 동기화 & 비동기화)

async function 선언은 AsyncFunction객체를 반환하는 하나의 비동기 함수를 정의합니다. 비동기 함수는 이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise를 사용하여 결과를 반환합니다. 그러나 비동기 함수를 사용하는 코드의 구문과 구조는, 표준 동기 함수를 사용하는것과 많이 비슷합니다. - MDN Web Docs -

동기 : 요청을 보낸 후 해당 응답을 받아야 다음 동작을 실행(ex.은행)
비동기 : 요청을 보낸 후 응답에 관계 없이 다음 동작을 실행(ex.카페)

특정 연산(호출) 후 다음 연산을 처리해야 할 경우에 비동기 방식은 로직 순서를 의도적으로 완벽하게 진행시키기에 적합하지 않다(콜백 무한증식 현상). 따라서 이를 보완하고자 promise 키워드를 사용한다.

---

매개변수

name함수의 이름.param함수에게 전달되기 위한 인자의 이름.statements함수본문을 구성하는 내용.

반환 값

Promise : async 함수에 의해 반환 된 값으로 해결되거나 async함수 내에서 발생하는 캐치되지 않는 예외로 거부되는 값.

Description

async 함수에는 await식이 포함될 수 있습니다. 이 식은 async 함수의 실행을 일시 중지하고 전달 된 Promise의 해결을 기다린 다음 async 함수의 실행을 다시 시작하고 완료후 값을 반환합니다.
await 키워드는 async 함수에서만 유효하다는 것을 기억하십시오. async 함수의 본문 외부에서 사용하면 SyntaxError가 발생합니다.
async/await 함수의 목적은 사용하는 여러 promise의 동작을 동기스럽게 사용할 수 있게 하고, 어떠한 동작을 여러 promise의 그룹에서 간단하게 동작하게 하는 것이다. promise가 구조화된 callback과 유사한 것 처럼 async/await또한 제네레이터(generator)와 프로미스(promise)를 묶는것과 유사하다.
async 함수는 항상 promise를 반환합니다. 만약 async 함수의 반환값이 명시적으로 promise가 아니라면 암묵적으로 promise로 감싸집니다.

- MDN Web Docs -

---

Promise

Promise 객체를 사용하여 비동기 작업이(성공 혹은 실패) 완료된 후의 결과 값을 받을 수 있다. 그래서 이후 처리를 쉽게 컨트롤 가능하다. Promise는 함수를 인자로 받으며 인자로 들어온 함수는 다시 resolve(비동기 처리 성공)와 reject(비동기 처리 실패) 2개의 함수를 인자로 받게 된다. resolve 시 then 메소드, reject 시 catch 메소드의 인자로 넘어간다.
then 메소드는 다시 Promise를 반환하여 연속적으로 then 사용가능하다.

 

---

Ref. 

ㅁ 개요 : medium.com/@yoohl/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EB%B9%84%EB%8F%99%EA%B8%B0-%EB%8F%99%EA%B8%B0-ac9495e42d0

ㅁ 개요 : mber.tistory.com/8

ㅁ 예제 및 팁 : aridom.tistory.com/36

ㅁ MDN Web Docs : developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/async_function