1. 사용 이점
자바스크립트는 비동기 처리 시 콜백함수를 통해 처리할 수 있습니다.
그러나 해당 방법은 코드가 복잡해짐에 따라 한계점이 명확해집니다.
이때 Promise 객체 혹은 Async를 사용하여 비동기 처리하여 얻는 이점은 다음과 같습니다.
- 비동기 처리 시점 명확
- 수정, 삭제, 추가 유연
- 코드의 유지 보수성 증가
2. Promise 객체에 대하여
Promise는 비동기 처리에 대해, 처리가 끝나면 알려달라는 약속(Promise)입니다.
new Promise(function (resolve,reject 함수 호출) {
로직;
resolve 함수 실행;
})
new 연산자로 호출한 Promise의 인자에 resolve나 reject가 구문으로 들어갑니다.
이때 resolve 함수가 실행 됐다면 후속처리메소드 then(다음, 응답결과)으로 넘어갑니다.
이때 reject(거부) 함수가 실행 됐다면 catch(오류)으로 넘어갑니다.
new Promise(function (resolve, reject) {
setTimeout(() => {
let tOrF = 1 + 1;
tOrF === 2 ? resolve('success') : reject('fail');
}, 1000);
})
.then((message) => {
console.log(message);
})
.catch((message) => {
console.log(message);
});
//"참"이므로 success
1. tOrF를 선언했습니다.
2. 삼항연산자를 사용하여, 조건이 참이면 resove, 거짓이면 reject입니다.
3. 반드시 2번이 있어야. then 혹은 catch가 다음을 후속처리합니다.
3. Promise 객체의 연결 Promise Chaining
then메소드를 사용하고 나면 새로운 Promise 객체가 반환됩니다. 이를 활용하여 로직을 연결할 수 있습니다.
new Promise(function (resolve, reject) {
setTimeout(() => {
let tOrF = 1 + 1;
tOrF === 2 ? resolve('success') : reject('fail');
}, 1000);
})
.then((message) => {
console.log(message);
return new Promise(function (resolve) {
let twice = `${message}, ${message}`;
resolve(twice);
});
})
.then((message) => {
console.log(message);
});
//success
//success, success
'[JS] 학습내용' 카테고리의 다른 글
자바스크립트 class 사용하기(객체 지향 언어에서 빼놓을 수 없다!) (0) | 2024.05.06 |
---|---|
자바스크립트 JS 비동기 처리와 콜백지옥을 알아보자 (+setTimeout) (0) | 2024.05.02 |
자바스크립트 break,continue 사용 방법, 쓰는 법 (0) | 2024.04.25 |
자바스크립트 스위치 js switch 쓰는 법 (0) | 2024.04.22 |
자바스크립트 화살표 함수 쓰는 법 (0) | 2024.04.22 |