[JS]Promise

promise란?

결과를 제공하겠다는 약속을 말한다.

 

비동기 작업이 맞이할 미래의 결과값을 나타낸다.이전에는  콜백함수를 사용함으로써 함수 내부에서 또 다른 함수를 호출해 후속 처리 작업을 했지만 ..가독성도 안좋고 코드 길이도 길어지면서 콜백지옥(callback hell)이 발생하곤했다!

 

그래서 이를  해결하고자 promise 객체가 등장했다.

 

🚩생성하기

const 변수명 = new Promise((resolve,reject) => { } )

promise 생성자 함수로 생성한다.

이때 ,resolves는 성공의 상태를 뜻하고 reject는 거부의 상태를 뜻한다.

 

🚩객체 처리

성공하여 resolve(data)를 호출하면,

.then() : 성공처리

.catch(): rejected된 결과 반환 처리

.finally(): 성공이든 실패든 상관없이 항상 동작이 종료 되기전 마지막에 실행한다!

 

🚩상태

- pending: 대기

<settled>

- fullfilled : 성공(=resolved)

- rejected : 처리 실패

 

settled 상태(=결과가 나온)가 되어야 체인 이동이 가능하다.

 

<async/await>

await: 해당 동작이 settled가 될 때 까지 기다림.

 

await는 async 함수 안에서만 동작하며, promise가 처리될 때까지 함수 실행을 기다리는 것이다.

 

async function f() {

  let promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve("완료!"), 1000)
  });

  let result = await promise; // 프라미스가 이행될 때까지 기다림 (^)

  alert(result); // "완료!"
}

f();

 

 

^가 있는 줄에서 잠시 멈춰서 기다렸다가 promise가 처리되면 실행이 재개되어 result값이 나온다.

이렇게 기다리는 동안엔 엔진이 다른 일(다른 스크립트를 실행, 이벤트 처리 등)을 할 수 있기 때문에, CPU 리소스가 낭비되지 않는다고 한다!