*fetch 메서드가 리턴하는 Promise

 

Promise는 비동기 오퍼레이션에서 사용

Javascript는 싱글스레드 환경에서 동작하기때문에

백엔드로 보낸 요청에 응답이 30초가 걸리면 30초동안 아무것도 못하는 상태가 된다.

따라서 자바스크립트 엔진은 스레드 밖에서 이런 오퍼레이션을 실행해준다.

스레드 밖에서 HTTP응답을 처리하려면 여러가지 콜백 함수를 구현해야하는데,

Promise가 이런 콜백지옥을 피할 수 있게 만들어 준다.

Promise의 상태

1. Pending(기다리는 상태)

2. Resolve(주어지는 값으로 수행하는 Promise 객체 반환)

3. Reject(거부하는 Promise객체반환)

 

Promise의 인스턴스메서드

1. Promise.prototype.then()

2. Promise.prototype.catch()

3. Promise.prototype.finally()

 

사용예제

let myPromise = new Promise((resolve, reject) => {
	// 비동기 작업이 성공한 경우 reslove()를 호출, 실패시 reject()를 호출한다.
    setTimeout( function() {
    resolve("성공");
    reject(new Error("network Err"));
  }, 300)
})

//위의 결과로 Promise객체를 반환 받을 수 있고(성공이든 실패든)
//그 후 인스턴스 메서드로 예외처리를 정의할 수 있다

myPromise
.then((value)=>{
	console.log(value);
})
.catch((error)=>{
	console.log(error);
})

 

'웹개발 > 프론트엔드' 카테고리의 다른 글

React native web TypeError : fetch failed 해결  (0) 2025.02.25
REACT componentDidMount  (0) 2022.08.09
REACT 프로젝트 생성  (0) 2022.08.03
프론트엔드란  (0) 2022.08.03

+ Recent posts