
ES6(ECMAScript 2015) – 프로미스 – 0 – 프로미스의 개념과 사용
ES6(ECMAScript 2015)
ES6(ECMAScript 2015)은 자바스크립트의 버전 중 하나로, 2015년에 발표되었습니다. ES6는 많은 새로운 기능과 개선 사항을 도입하여 개발자들이 더욱 효율적으로 코드를 작성할 수 있게 해줍니다. 이 중에서도 프로미스는 비동기 처리를 더욱 간편하게 다룰 수 있도록 도와주는 기능입니다.
프로미스란?
프로미스는 자바스크립트에서 비동기 작업을 처리하기 위해 사용되는 객체입니다. 비유적으로 설명하자면, 프로미스는 우리가 미리 주문한 음식이 도착했을 때 알려주는 테이블 호출기와 비슷합니다. 주문을 할 때는 요리가 준비될 때까지 기다리지 않고 다른 작업을 할 수 있으며, 요리가 준비되면 알림을 받아 처리할 수 있습니다. 이러한 비동기 작업의 처리를 프로미스가 도와줍니다.
프로미스의 사용
프로미스는 new Promise()
생성자를 사용하여 생성할 수 있습니다. 프로미스 생성자는 함수를 인자로 받으며, 이 함수는 두 개의 콜백 함수를 인자로 받습니다. 첫 번째 콜백 함수는 비동기 작업을 수행하고, 성공한 경우 resolve()
함수를 호출하여 결과 값을 전달합니다. 두 번째 콜백 함수는 작업이 실패한 경우 reject()
함수를 호출하여 에러를 전달합니다.
예를 들어, 비동기적으로 데이터를 불러오는 작업을 프로미스로 처리해보겠습니다.
const fetchData = new Promise((resolve, reject) => {
// 비동기 작업 수행
setTimeout(() => {
const data = { id: 1, name: 'John' };
if (data) {
resolve(data); // 작업이 성공한 경우 resolve 호출
} else {
reject('Error occurred'); // 작업이 실패한 경우 reject 호출
}
}, 2000); // 2초 후에 작업이 완료됨
});
fetchData
.then(result => {
console.log(result); // 작업이 성공한 경우 실행됨
})
.catch(error => {
console.error(error); // 작업이 실패한 경우 실행됨
});
위의 코드에서는 fetchData
라는 프로미스 객체를 생성합니다. 이 프로미스는 2초 후에 데이터를 불러옵니다. 데이터를 성공적으로 불러온 경우 resolve()
함수를 호출하여 데이터를 전달하고, 실패한 경우 reject()
함수를 호출하여 에러를 전달합니다. 그리고 .then()
과 .catch()
메서드를 사용하여 프로미스의 상태를 처리합니다. .then()
은 작업이 성공한 경우 실행되고, .catch()
는 작업이 실패한 경우 실행됩니다.
프로미스를 사용함으로써 비동기 작업을 좀 더 구조적으로 다룰 수 있습니다. 작업이 완료되면 resolve()
함수를 호출하고, 결과 값을 .then()
메서드에서 받아 처리할 수 있습니다. 작업이 실패하면 reject()
함수를 호출하고, 에러를 .catch()
메서드에서 처리할 수 있습니다.
프로미스의 주의할 점
프로미스를 사용할 때 주의해야 할 몇 가지 점이 있습니다.
-
프로미스는 한 번 실행된 후에는 상태가 변경되지 않습니다. 즉, 한 번
resolve()
또는reject()
가 호출되면 상태가 결정되고 해당 상태는 변하지 않습니다. 따라서 프로미스를 다시 사용하려면 새로운 프로미스를 생성해야 합니다. -
.then()
메서드는 항상 새로운 프로미스를 반환합니다. 이를 이용하여 여러 개의 비동기 작업을 연결하거나 체이닝할 수 있습니다. -
프로미스 체이닝에서 발생한 에러는
.catch()
메서드로만 처리됩니다..then()
메서드 체인 중 어떤 부분에서 에러가 발생하면 바로 다음.catch()
블록으로 이동하여 에러를 처리합니다. 따라서.catch()
를 적절히 활용하여 예외 상황을 처리해야 합니다. -
비동기 작업을 수행하는 함수에서 예외가 발생하면 프로미스가 거부됩니다. 이를
.catch()
메서드에서 처리해주어야 합니다. 또한, 비동기 함수 내부에서throw
를 사용하여 에러를 발생시키면 자동으로 거부 상태로 전환됩니다.
프로미스를 사용하는 것은 비동기 작업을 더욱 효율적으로 다룰 수 있는 방법 중 하나입니다. 프로미스를 사용하여 비동기 코드를 읽기 쉽고 유지보수하기 쉽게 작성할 수 있습니다. 프로미스의 사용법을 익히고, 주의해야 할 점들을 숙지하여 더 나은 자바스크립트 코드를 작성해보세요!
마크다운 포맷:
**ES6(ECMAScript 2015) - 프로미스 - 0 - 프로미스의 개념과 사용**
# ES6(ECMAScript 2015)
...
## 프로미스란?
...
## 프로미스의 사용
...
## 프로미스의 주의할 점
...
주의할 점을 보기 쉽게 정리하면 다음과 같습니다:
- 프로미스는 한 번 상태가 결정되면 변경되지 않는다.
.then()
메서드는 항상 새로운 프로미스를 반환한다.- 프로미스 체이닝에서 발생한 에러는
.catch()
메서드로만 처리된다. - 비동기 작업을 수행하는 함수에서 예외가 발생하면 프로미스가 거부된다.
- 예외 상황을 처리하기 위해
.catch()
메서드를 적절히 사용해야 한다.