본문 바로가기
JavaScript

JavaScript 비동기 처리 – Promise 심화

by GPT러너 2025. 4. 14.
반응형

안녕하세요! 오늘은 JavaScript 비동기 처리 중, Promise에 대한 심화 내용을 살펴볼 예정입니다. 초보자분들도 이해할 수 있도록 간단히 설명하고 코드 예시도 준비했으니, 함께 알아봐요. 😊

🔎 Promise 이해하기

먼저, Promise는 JavaScript에서 비동기 작업을 좀 더 편리하게 처리할 수 있도록 도와주는 객체입니다. 주로 서버에서 받아온 데이터를 화면에 표시할 때 많이 사용하는데요, 이때 데이터가 바로 반환되지 않고, 시간이 걸리는 경우가 많아서 비동기 처리 방식을 사용합니다.

📝 Promise 코드 예시


// Promise 선언
let promise = new Promise(function(resolve, reject) {
  // 비동기 작업 수행
  
  // 작업이 성공하면 resolve 호출
  if (/* 작업 성공 */) {
    resolve("작업 결과");
  }
  
  // 작업이 실패하면 reject 호출
  else {
    reject(new Error("작업 실패"));
  }
});

// Promise 사용
promise.then(
  function(result) { /* 작업이 성공했을 때 수행할 작업 */ },
  function(err) { /* 작업이 실패했을 때 수행할 작업 */ }
);

💡 Promise 체이닝

Promise의 또 다른 특징은 여러 개의 비동기 작업을 연결해서 처리할 수 있다는 것입니다. 이렇게 연결된 Promise들을 '체이닝(Chaining)'이라고 합니다. 이제 이 체이닝에 대한 코드 예시를 함께 보도록 하죠.

📝 Promise 체이닝 코드 예시


// Promise 체이닝
new Promise(function(resolve, reject) {
  // 첫 번째 비동기 작업 수행
  if (/* 작업 성공 */) {
    resolve("첫 번째 작업 결과");
  }
  else {
    reject(new Error("첫 번째 작업 실패"));
  }
}).then(function(result) {
  // 두 번째 비동기 작업 수행
  return /* 두 번째 비동기 작업 */;
}).then(function(result) {
  // 세 번째 비동기 작업 수행
  return /* 세 번째 비동기 작업 */;
}).catch(function(err) {
  // 작업 중 오류가 발생했을 때 수행할 작업
});

오늘은 JavaScript 비동기 처리 중, Promise에 대한 심화 내용을 함께 살펴보았습니다. Promise를 이해하고, 그에 따른 코드 작성 방법을 배워보았는데요. 이를 통해 비동기 처리에서 발생할 수 있는 복잡성을 조금이나마 해소할 수 있었으면 좋겠습니다. 아직 모르는 부분이나 이해가 안 가는 부분이 있다면, 망설이지 마시고 댓글로 질문해주세요! 😊

📌 다음 글 예고: JavaScript 비동기 처리 – Async/Await

 

반응형