오늘의 공부 👍

오늘은 230320_TIL에서 언급했던 비동기 처리에 대해서 자세히 알아보겠습니다.

📝 비동기 처리

▷ 종류

• callback
• promise
• async, await

📝 promise

• async, await를 설명하기 이전에 promise에 대해서 알아야 합니다.
• promise가 생성된 시점에서는 알려지지 않았을 수도 있는 값을 위한 대리자
• promise를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다.
• 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(promise)을 반환합니다.

▷ promise의 상태

• promise의 처리과정을 의미한다.
• promise를 생성하고 종료될 때까지 3가지 상태를 갖는다.
  • Pending(대기) : 비동기 처리를 이행하지도, 거부하지도 않은 초기 상태.
  • Fulfilled(이행) : 비동기처리가 성공적으로 완료됨.
    과 값을 반환한 상태
  • Rejected(실패) : 비동기처리가 실패함.

📝 async

• 비동기 작업을 만드는 손쉬운 방법
• async 함수는 Promise 와 굉장히 밀접한 연관을 가지고 있습니다.
• async 함수의 리턴 값은 무조건 Promise 입니다
• async 함수 안에서는 await 를 쓸 수 있습니다.

    async function foo() {
        return 1
    }

• 위 코드는 아래 코드와 같습니다.

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

📝 await

• promise가 끝날 때까지 기다립니다.
• async 함수 내부에서만 사용할 수 있습니다.
• promise 가 resolve 한 값을 내놓습니다.
• promise가 끝나거나 reject 될 때까지 async 함수의 실행을 일시 정지하고, promise가 끝나면 async 함수를 일시 정지한 부분부터 실행합니다.

    async function foo() {
        await 1
    }

• 위 코드는 아래 코드와 같습니다.

    function foo() {
        return Promise.resolve(1).then(() => undefined)
    }

출처 및 참고
MDN docs await
MDN docs async
비동기, Promise, async, await 확실하게 이해하기
코드캠프