// 데이터 가져오고 → 가공하고 → 저장하고 → 알림 보내기
fetchUser(userId, function(user) {
  fetchOrders(user.id, function(orders) {
    processOrders(orders, function(result) {
      saveResult(result, function(saved) {
        sendNotification(saved, function(notif) {
          // 콜백 지옥! (Callback Hell)
          // 여기까지 오는데 들여쓰기가 총 5단계
        })
      })
    })
  })
})

// Promise로 같은 로직 작성
fetchUser(userId)
  .then(user => fetchOrders(user.id))
  .then(orders => processOrders(orders))
  .then(result => saveResult(result))
  .then(saved => sendNotification(saved))
  .catch(error => console.error("어디서든 에러나면 여기로"));

const myPromise = new Promise((resolve, reject) => {
  // 비동기 작업 수행
  const success = true;

  if (success) {
    resolve("성공 값!");        // Fulfilled 상태로 전환
  } else {
    reject(new Error("실패"));  // Rejected 상태로 전환
  }
});

// 사용
myPromise
  .then(value => console.log(value))      // "성공 값!"
  .catch(error => console.error(error));  // 에러 처리

// 브라우저 콘솔에 복붙해서 바로 실행해볼 수 있습니다
fetch('https://jsonplaceholder.typicode.com/users/1')
  .then(response => response.json())
  .then(user => console.log(user.name))  // "Leanne Graham"
  .catch(error => console.error("요청 실패:", error));

// Promise 버전 (단점: 변수 공유 어려움, 읽기 어려움)
function getOrdersForUser(userId) {
  return fetchUser(userId)
    .then(user => {
      return fetchOrders(user.id)
        .then(orders => ({ user, orders })); // user를 넘기는 꼼수
    })
    .then(({ user, orders}) => {
      return processOrders(user, orders);
    });
}

// async/await 버전
async function getOrdersForUser(userId) {
  const user = await fetchUser(userId);       // user 변수 자유롭게 사용
  const orders = await fetchOrders(user.id);  // orders 변수 자유롭게 사용
  return processOrders(user, orders);         // 둘 다 그냥 쓰면 됨!
}

async function getOrdersForUser(userId) {
  try {
    const user = await fetchUser(userId);
    const orders = await fetchOrders(user.id);
    return processOrders(user, orders);
  } catch (error) {
    // 어디서 에러가 발생했는지 스택 트레이스가 명확함
    console.error("에러 발생:", error);
  }
}

// 각 then 안에서 변수를 공유하기 어려움
fetchUser()
  .then(user => {
    return fetchOrders(user.id); // user를 다음 then에서도 쓰고 싶다면?
  })
  .then(orders => {
    // 여기서 user에 접근하려면?
    // user를 쓰려면 외부 변수에 저장하는 꼼수를 써야 함
  });

// 에러가 어느 then에서 발생한건지 스택 트레이스가 불명확
fetchUser()
    .then(processData)    // 여기서 났나?
    .then(saveData)       // 아니면 여기?
    .then(notify)         // 아니면 여기?
    .catch(e => console.log(e)); // 에러 위치 추적이 어려움

const promise = fetchHugeData(); // 시작

// 사용자가 페이지를 떠남.. 근데 멈출 수가 없음
// promise.cancel() ← 이런 메서드가 없음

// 조건에 따라 다른 처리가 필요할 때 가독성이 나빠짐
fetchData()
  .then(data => {
    if (data.type === 'A') {
      return processA(data).then(result => ({result, type: 'A'}));
    } else {
      return processB(data).then(result => ({result, type: 'B'}));
    }
  })
  .then(({result, type}) => {
    // type을 억지로 넘겨줘야 함. 어색한 코드
  })

// 3개를 순차적으로 하면 3초씩 = 9초
// Promise.all로 동시에 하면 3초 (가장 오래 걸리는 것만큼)
const [user, posts, comments] = await Promise.all([
  fetchUser(userId),
  fetchPosts(userId),
  fetchComments(userId)
]);
// 단, 하나라도 실패하면 전체 실패

// Promise.all의 특성: 하나라도 실패하면 나머지도 무시됨
// Promise.allSettled: 성공이든 실패든 모두의 결과를 돌려줌
const results = await Promise.allSettled([
  fetchUser(userId),
  fetchPosts(userId),     // ← 이게 실패해도
  fetchComments(userId)   // 이건 결과를 돌려줌
]);

results.forEach(result => {
  if (result.status === 'fulfilled') {
    console.log(result.value);
  }
  if (result.status === 'rejected') {
    console.log(result.reason);
  }
})

// 타임아웃 구현에 유용
const result = await Promise.race([
  fetchData(),                    // 실제 요청
  new Promise((_, reject) => {    // 타임아웃
    setTimeout(() => reject(new Error("Timeout")), 5000);
  })
]);

const controller = new AbortController();

// 요청 시작
fetch('/api/huge-data', { signal: controller.signal })
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => {
    if (error.name === 'AbortError') {
      console.log('요청이 취소되었습니다');  // 취소 감지
    }
  });

// 사용자가 페이지를 떠날 때
controller.abort(); // 요청 취소