본문 바로가기

JavaScript/Web Development

[JavaScript] async 함수가 리턴하는 promise 객체

다음의 코드를 실행하면,

async function fetchAndPrint() {
  return 3;
}

fetchAndPrint();

async 가 붙은 함수는 항상 promise 객체를 return 한다. 따라서, fechAndPrint 함수는 promise 객체를 return 하며, 이는 fulfilled 상태이고 그 작업성공결과는 3이다.

 

 

다음 함수를 실행하면,

async function fetchAndPrint() {
  return fetch('https://jsonplaceholder.typicode.com/users')
          .then((response) => response.text());
}

fetchAndPrint();

 

리턴된 promise 객체와 동일한 상태, 작업성공결과를 가진 promise 객체가 리턴되었음.

 


 

[async 함수가 return 하는 promise 객체]

 

1. 어떤 값을 리턴하는 경우

 

(1) Promise 객체를 리턴하는 경우

async 함수 안에서 Promise 객체를 리턴하는 경우에는 해당 Promise 객체와 동일한 상태와 작업 성공 결과(또는 작업 실패 정보)를 가진 Promise 객체를 리턴한다.(그냥 해당 Promise 객체를 리턴한다고 봐도 됨.)

async function fetchAndPrint() {
  return new Promise((resolve, reject)=> {
    setTimeout(() => { resolve('abc'); }, 4000);
  });
}

fetchAndPrint();

이렇게 pending 상태의 Promise 객체를 리턴하기도 하고(리턴된 Promise 객체는 약 4초 후에 fulfilled 상태가 됨.)

async function fetchAndPrint() {
  return Promise.resolve('Success');
}

fetchAndPrint();

이미 fulfilled 상태인 Promise 객체나

async function fetchAndPrint() {
  return Promise.reject(new Error('Fail'));
}

fetchAndPrint();

이미 rejected 상태인 Promise 객체를 리턴하는 경우 전부 다 해당됨. (위 이미지에서는 rejected 상태의 Promise 객체를 따로 처리해주지 않았기 때문에 에러가 발생)

 

 

(2) Promise 객체 이외의 값을 리턴하는 경우

 

async 함수 내부에서 Promise 객체 이외에 숫자나 문자열, 일반 객체 등을 리턴하는 경우에는, fulfilled 상태이면서, 리턴된 값을 작업 성공 결과로 가진 Promise 객체를 리턴한다.

async function fetchAndPrint() {
  return 3;
}

fetchAndPrint();

이런 코드나

async function fetchAndPrint() {
  return 'Hello';
}

fetchAndPrint();

이런 코드,

async function fetchAndPrint() {
  const member = {
    name: 'Jerry',
    email: 'jerry@codeitmall.kr',
    department: 'sales',
  };

  return member;
}

fetchAndPrint();

이런 코드들 모두 여기에 해당한다.


2. 아무 값도 리턴하지 않은 경우

 

async function fetchAndPrint() {
  console.log('Hello Programming!');
}

fetchAndPrint();

이렇게 함수에서 아무런 값도 리턴하지 않으면 자바스크립트에서는 undefined를 리턴한 것으로 간주한다. 따라서

이 경우에는 fulfilled 상태이면서, undefined를 작업 성공 결과로 가진 Promise 객체가 리턴된다.

 


3. async 함수 내부에서 에러가 발생했을 때

 

async function fetchAndPrint() {
  throw new Error('Fail');
}

fetchAndPrint();

 

async 함수 안에서 에러가 발생하면, rejected 상태이면서, 해당 에러 객체를 작업 실패 정보로 가진 Promise 객체가 리턴된다

'JavaScript > Web Development' 카테고리의 다른 글

[JavaScript] async/ await 의 catch/ finally 문  (0) 2023.03.09
[JavaScript] async/ await  (0) 2023.03.07
[JavaScript] axios  (0) 2023.03.06
[JavaScript] Ajax  (0) 2023.03.06
[JavaScript] Promise 객체 만들기  (0) 2023.03.06