개발일지/TIL(Today I Learned)

2024-12-11

프린스 알리 2024. 12. 11.

내일배움캠프 Node.js 트랙 32일차

Q1. Promise는 함수인가?

단도직입적으로 말하자면, Promise는 함수가 아니라 객체이다. 정확히는 JavaScript에서 제공하는 내장 객체로, 비동기 작업을 처리하고, 그 작업의 성공(resolve) 또는 실패(reject) 상태를 추적하고 관리한다.

Promise의 정의

Promise 는 JavaScript의 비동기 작업을 처리하기 위한 객체이다. 주로 시간이 걸리는 작업(예: API 호출, 파일 읽기, 데이터베이스 작업 등)을 처리한 뒤 그 결과를 다룰 때 사용된다.

  • Promise 객체는 비동기 작업의 성공 또는 실패를 나타내는 값을 캡슐화한다.
  • Promise는 pending(대기 중) → fulfilled(성공) 또는 rejected(실패) 의 상태로 전환된다.

Promise의 생성자

Promise는 new Promise 를 통해 생성된다. 이때, Promise 객체의 생성자(new Promise)는 함수를 인자로 받는다. 이 함수는 두 가지 매개변수를 가진다:

  • resolve: 작업이 성공했을 때 호출
  • reject: 작업이 실패했을 때 호출

예제: Promise 생성하기

const myPromise = new Promise((resolve, reject) => {
  const success = true; // 성공 여부
  if (success) {
    resolve('작업 성공!');
  } else {
    reject('작업 실패!');
  }
});

위의 코드에서 myPromise는 Promise 객체이다.

Promise 사용법

1. thencatch로 결과 처리

const myPromise = new Promise((resolve, reject) => {
  const success = true;
  if (success) {
    resolve('작업 성공!');
  } else {
    reject('작업 실패!');
  }
});

myPromise
  .then((result) => {
    console.log('성공:', result); // resolve가 호출된 경우
  })
  .catch((error) => {
    console.error('실패:', error); // reject가 호출된 경우
  });

2. async/await로 사용

Promise는 async/await과 함께 사용하면 더 간결하게 코드를 작성할 수 있다.

const myPromise = new Promise((resolve) => {
  setTimeout(() => resolve('작업 완료!'), 1000); // 1초 후 성공
});

const run = async () => {
  const result = await myPromise;
  console.log(result); // "작업 완료!" 출력
};

run();

 

Promise는 함수인가? - 간단 요약

Promise는 객체이다.

  • 비동기 작업을 표현하고, 성공(resolve) 또는 실패(reject) 상태를 추적한다.
  • then으로 성공 결과를, catch로 실패 결과를 처리한다.

Q2. Promise에는 콜백 함수의 반환값이 들어있는가?

그렇기도 하고 아니기도 하다.

Promise 객체 자체에는 resolve 혹은 reject된 결과물이 직접 담겨 있지는 않지만, 그대신 비동기 작업의 상태와 결과를 추적하고 있어서,then, catch, 또는 await을 통해 그 결과물에 접근할 수 있다.

Promise의 상태와 결과

Promise는 세 가지 상태를 가진다:

  • pending (대기 중)
    • 비동기 작업이 아직 완료되지 않은 초기 상태.
    • 이 상태에서는 결과물이 없다.
  • fulfilled (이행됨)
    • 비동기 작업이 성공적으로 완료되었을 때.
    • 이 상태가 되면 Promise는 resolve에 전달된 값을 결과로 가진다.
  • rejected (거부됨)
    • 비동기 작업이 실패했을 때.
    • 이 상태가 되면 Promise는 reject에 전달된 에러를 결과로 가진다.

Promise의 결과에 접근하는 방법

Promise 자체는 내부적으로 상태와 결과를 관리하지만, 결과에 직접 접근할 수는 없다. 대신, 결과를 가져오려면 다음 방법을 사용해야 한다.

1. then으로 결과 가져오기 (성공 시)

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve('작업 성공!'), 1000); // 1초 후 resolve 호출
});

promise.then((result) => {
  console.log(result); // '작업 성공!'
});

2. catch로 결과 가져오기 (실패 시)

const promise = new Promise((resolve, reject) => {
  setTimeout(() => reject('작업 실패!'), 1000); // 1초 후 reject 호출
});

promise.catch((error) => {
  console.error(error); // '작업 실패!'
});

3. async/await으로 결과 가져오기

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve('작업 성공!'), 1000); // 1초 후 resolve 호출
});

async function fetchResult() {
  const result = await promise; // await로 resolve 결과를 가져옴
  console.log(result); // '작업 성공!'
}

fetchResult();

 

Promise에는 콜백 함수의 반환값이 들어있는가? - 간단 요약

(1) Promise에는 resolve 또는 reject된 결과가 내부적으로 저장되지만, 이를 직접 확인할 수는 없다.
(2) 결과는 then, catch, await 같은 방법으로 접근한다.
(3) Promise의 상태(pending, fulfilled, rejected)에 따라 결과를 다룰 수 있다.

=> 왜 결과를 직접 접근할 수 없을까?

Promise는 비동기 작업을 처리하기 위해 설계된 객체로, 작업이 완료되기 전까지 결과를 알 수 없기 때문이다.
JavaScript에서는 비동기 작업을 미래의 결과로 취급하며, 그 결과에 접근하려면 then, catch, await 등 적절한 메서드를 통해야만 한다.

'개발일지 > TIL(Today I Learned)' 카테고리의 다른 글

2024-12-13  (1) 2024.12.13
2024-12-12  (0) 2024.12.12
2024-12-10 <HTTP와 TCP, 그리고 웹소켓>  (1) 2024.12.10
2024-12-09  (4) 2024.12.09
2024-12-06  (2) 2024.12.06

댓글