0.내가 알던 Promise

promise는 이벤트루프 기반이라 비동기를 사용하기에 유리한 자바스크립트에서
콜백헬을 해결하기 위해 나타난 존재라고 생각하고 있었다.

async, await 보다는 조금 더 불편하지만
더 많은것을 할 수 있게 해주면서 가끔씩 잘못걸리면 정말 무서운 녀석..
나는 fp-ts를 사용하면서 Task를 쓸때
어 이거 Promise랑 완전히 똑같네 라는 생각이 들었었다.
결국엔 아직 완료되지 않았거나 완료됬거나 하는
시간을 다룰 수 있게 해주는 고마운 존재다.

그러니까 코드로 하면

// 콜백을 이용한 비동기 작업
function fn() {
setTimeout(() => {
      const a = '하나'
      setTimeout(() => {
        const b = `${a} 둘`
          setTimeout(() => {
            const c = `${b} 셋`
              console.log(c) //하나 둘 셋
          }, 1000);
      }, 1000);
  }, 1000);
}  

//Promise를 이용한 비동기작업
const timeOutFn = (data) => new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(data);
      }, 1000);
    })

timeOutFn('하나')
  .then((data) => { 
    console.log(data)
    return timeOutFn(`${data} 둘`)})
  .then((data) => { 
    console.log(data)
    return timeOutFn(`${data} 셋`)})
  .then((data) => console.log(data)); //하나 둘 셋

//async/await를 이용한 비동기작업
const timeOutFn = (data) => new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(data);
      }, 1000);
    })

const sumFn = async() => {
  const a = await timeOutFn('하나')
  const b = a + ' ' + await timeOutFn('둘')
  const c = b + ' ' + await timeOutFn('셋')
  return c
}
console.log(sumFn()) // 하나 둘 셋

이런식이다

1.MDN의 설명

1) 한줄설명

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다.

2) 자세한 설명

Promise는 프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있습니다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(프로미스)을 반환합니다.

Promise는 다음 중 하나의 상태를 가집니다.

• 대기(pending): 이행하지도, 거부하지도 않은 초기 상태.
• 이행(fulfilled): 연산이 성공적으로 완료됨.
• 거부(rejected): 연산이 실패함.

Promise.reject() //rejected 객체를 반환
Promise.resolve() //fulfilled 객체를 반환

- 동시성

Promise에는 여러 Promise를 다루는 함수 네가지도 존재한다.
자바스크립트엔진은 쓰레드 하나로 돌아가므로 병렬로 연산할수는 없지만
비동기적으로 여러 연산을 하는것을통해
동시에 작업이 실행된것처럼 보이면 되므로
동시성을 다룰 수 있다.

Promise.all() //모든 Promise가 fulfilled일때 실행
Promise.allSettled() //모든 약속이 fulfilled또는 rejected가 됐을때 실행
Promise.any() //Promise중에 하나라도 fulfilled가 됐을때 실행
//단 모두 reject일때 rejected실행
Promise.race() //Promise가 fulfilled되거나 rejected될때까지 기다린다
//fulfilled되면 첫번째 Promise의 값으로 fulfilled객체가 리턴되고
//rejected되면 첫번째 Promise의 이유로 rejected객체가 리턴된다

2.결론

어렵다.. 하지만 api콜을 할때 항상 쓰는것이 Promise이고
async await보다 유연하니까 자유롭게 다룰 수 있어야겠다

mdn Promise
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise
동시성, 병렬, 비돈기, 논블러킹
https://black7375.tistory.com/90