• 동기식 (Synchronous)
먼저 시작된 하나의 작업이 끝날 때까지 다른 작업을 시작하지 않고 기다렸다가 다 끝나면 새로운 작업을 시작하는 방식. 즉, 한 번에 여러 작업을 처리하지 않고 하나만 처리함.
• 비동기식 (Asynchronous)
먼저 실행된 작업이 끝날 때까지 기다리지 않고 다음 작업을 수행하는 방식. 즉, 한 번에 여러 작업을 처리함.
Promise
Promise 는 비동기 작업의 단위 입니다. Promise 는 비동기 작업을 조금 더 편하게 처리 할 수 있도록 ES6 에 도입된 기능입니다. 이전에는 비동기 작업을 처리 할 때에는 콜백 함수로 처리를 해야 했었는데요, 콜백 함수로 처리를 하게 된다면 비동기 작업이 많아질 경우 코드가 쉽게 난잡해지게 되었습니다.
const promise1 = new Promise((resolve, reject) => {
// 비동기 작업
});
Promise 는 성공 할 수도 있고, 실패 할 수도 있습니다. 성공 할 때에는 resolve 를 호출해주면 되고, 실패할 때에는 reject 를 호출해주면 됩니다.
<성공시>
const myPromise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve(1);
}, 1000);
});
myPromise.then(n => {
console.log(n);
});
<실패시>
const myPromise = new Promise((resolve, reject) => {
setTimeout(() => {
reject(new Error());
}, 1000);
});
myPromise
.then(n => {
console.log(n);
})
.catch(error => {
console.log(error);
});
프로미스의 에러 처리 방법
1. then 메소드의 두 번째 인자로 예외를 처리하는 방법
const promise = () => new Promise((resolve, reject) => {
let a = 1 + 1
if(a == 3) {
resolve('success')
} else {
reject('failed')
}
})
promise().then((message) => {
console.log('This is in the then ' + message)
}, (error) => {
console.log('This is in the then ' + error)
})
2. catch 메소드를 이용하여 예외를 처리하는 방법
const promise = () => new Promise((resolve, reject) => {
let a = 1 + 1
if(a == 3) {
resolve('success')
} else {
reject('failed')
}
})
promise().then((message) => {
console.log('This is in the then ' + message)
}).catch((error) => {
console.log('This is in the catch ' + error)
})
프로미스 체이닝
프로미스 체이닝이란, 프로미스 핸들러를 연달아 연결하는 것을 말한다. 이렇게 하면 여러 개의 비동기 작업을 순차적으로 수행할 수 있다는 특징이 있다.
정적 메소드
1. Promise.resolve : 프로미스 생성자를 사용하여 프로미스 객체를 반환하는 함수
2. Promise.reject : 주어진 사유로 거부되는 프로미스 생성
3. Promise.all : 메서드 인자로 프로미스 배열을 넣어, 모든 프로미스가 이행될 때까지 기다리고, 결과값을 출력
4. Promise.race : Promise.race() 는 Promise.any() 와 같이 여러 개의 프로미스 중 가장 먼저 처리된 프로미스의 결과값을 반환하지만, 차이점이 존재한다. Promise.any()는 가장 먼저 fulfilled(이행) 상태가 된 프로미스만을 반환하거나, 혹은 전부 rejected(실패) 상태가된 프로미스(AggregateError)를 반환한다. 반면 Promise.race() 는 fulfilled(이행), rejected(실패) 여부 상관없이 무조건 처리가 끝난 프로미스 결과값을 반환하다.
5. Promise.allSettled : Promise.all() 메서드의 업그레이드 버전으로, 주어진 모든 프로미스가 처리되면 모든 프로미스 각각의 상태와 값 (또는 거부 사유)을 모아놓은 배열을 반환한다.
'WEB > JavaScript' 카테고리의 다른 글
[JS] fetch 메소드 (0) | 2023.10.28 |
---|---|
[JS] 반복문 비동기 (0) | 2023.10.28 |
[JS] 모듈 (0) | 2023.10.28 |
[JS] json (0) | 2023.10.28 |
[JS] constructor & instanceof (0) | 2023.10.28 |