반응형
안녕하세요! 오늘은 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
반응형
'JavaScript' 카테고리의 다른 글
JavaScript에서의 Error Handling (2) | 2025.04.14 |
---|---|
JavaScript 비동기 처리 – Async/Await (0) | 2025.04.14 |
JavaScript 비동기 처리 – async와 await 심화 (0) | 2025.04.14 |
JavaScript 비동기 처리 – async와 await (0) | 2025.04.14 |
JavaScript 비동기 처리 – Promises와 Fetch API (0) | 2025.04.14 |