`Promise<T>`: 타입 붙은 Async 값

"Promise 가 아직 존재 안 하는 값에 대한 타입 붙은 wrapper."

`Promise` 가 묘사하는 것

Promise<T> 가 나중에 사용 가능할 T 타입 값 표현하는 generic 타입. Promise 가 3 상태 (pending, fulfilled, rejected); 타입이 fulfilled 값의 타입만 캡처. Rejection 이 타입 안 붙음 — TypeScript 가 어떤 에러 throw 될지 예측 못 함.

`Promise` 생산 방법:

Async 함수 (async function f(): Promise<User> { return getUser() })
new Promise<T>((resolve, reject) => ...)
Promise.resolve(value) 또는 Promise.reject(error)
fetch(), fs.readFile(), 등 library 호출

Promise 소비

2 방법: `.then(callback)` 체인 또는 async 함수 안 `await`. fetchUser().then(user => user.name) 와 const user = await fetchUser(); user.name 가 동등. async/await 형태가 일반적으로 선호 — 더 평평, 읽기 쉽고, try/catch 와 통합.

Composition 패턴

Async 함수가 자연스럽게 compose. async function load(): Promise 가 다른 async 함수 호출, await, derived 값 반환 가능. Promise wrapper 가 모든 step 가로질러 살아남음; 최상 호출에서만 unwrap (`await` 또는 `.then` 으로).

Promise 가 'T 타입의 미래 값' 의 타입. Async 코드를 '이건 너가 await 후의 타입' 으로 읽는 모델이 트랙의 나머지를 쉽게 만드는 거.

Code

Promise<T> — 생산과 소비·typescript

// Promise<T> — 미래 값.
async function fetchUser(id: number): Promise<User> {
  const res = await fetch(`/users/${id}`);
  return res.json() as Promise<User>;  // res.json() 가 Promise<any>; narrow
}

// Await — Promise unwrap.
async function main() {
  const user = await fetchUser(1);     // user: User
  console.log(user.name);
}

// .then 체인 — 같은 효과, 옛 문법.
fetchUser(1).then((user) => {
  console.log(user.name);              // callback 의 user: User
});

// Promise.resolve 와 reject.
const ready: Promise<number> = Promise.resolve(42);
const failed: Promise<never> = Promise.reject(new Error('nope'));

Exercise

이 .then 체인을 async/await 로 변환: fetchUser(1).then(u => fetchPosts(u.id)).then(posts => posts.length). async/await 버전이 같은 숫자 만들어야.

Hint

const u = await fetchUser(1); const posts = await fetchPosts(u.id); return posts.length. 3줄, top to bottom, 중간 값 명확히 이름.

`Promise<T>`: 타입 붙은 Async 값

`Promise` 가 묘사하는 것

Promise 소비

Composition 패턴

Code

External links

Exercise

Progress

댓글 0