JavaScript/JavaScript

비동기 - 예외 처리

IT Blue 2021. 8. 3. 14:49

 

비동기 - 예외처리 (then, catch, finally)

 

then

- 작업이 성공적으로 완료되면 Promise.resolve() 메소드를 통해 결과 값으로 이행하는 Promise 객체를 반환

- 실행 순서를 보장

- 콜백 지옥과 패턴이 동일해서 권장하지 않음

- async & await 패턴을 사용하기 어려운 환경일때 대체해서 사용

- 비동기 패턴을 대신해서 사용

function a() {
  return new Promise((resolve) => {
    setTimeout(() => {
      console.log('A')
      resolve()
    }, 1000)
  })
}
function test() {
  a().then(() => {
    console.log('B')
  })
}
test()

/* 실행순서 */
A
B

 

catch

- 작업이 실패(거부)되면 Promise.reject() 메소드를 통해 거부하는 Promise 객체를 반환

- 거부(reject) 되었을때 작동

- .then() 부분은 실행되지 않음

function a(number) {
  return new Promise((resolve, reject) => {
    if (number > 4) {
      // 거부
      reject()
      return
    }
    setTimeout(() => {
      console.log('A')
      // 이행
      resolve()
    }, 1000)
  })
}
function test() {
  a(5)
    .then(() => {
      console.log('Resolve!')
    })
    .catch(() => {
      console.log('Reject!')
    })
}
test()

/* 실행결과 */
Reject!

 

finally

- 이행 / 거부 결과에 상관없이 무조건 한번 실행되는 메소드

function a(number) {
  return new Promise((resolve, reject) => {
    if (number > 4) {
      // 거부
      reject()
      return
    }
    setTimeout(() => {
      console.log('A')
      // 이행
      resolve()
    }, 1000)
  })
}
function test() {
  a(5)
    .then(() => {
      console.log('Resolve!')
    })
    .catch(() => {
      console.log('Reject!')
    })
    .finally(() => {
      console.log('Done!')
    })
}
test()

/* 실행결과 */
Reject!
Done!

 

async & await 예외 처리

function a(number) {
  return new Promise((resolve, reject) => {
    if (number > 4) {
      // 거부
      reject()
      return
    }
    setTimeout(() => {
      console.log('A')
      // 이행
      resolve()
    }, 1000)
  })
}
async function test() {
  try {
    await a(5)
    console.log('Resolve!')
  } catch (error) {
    console.log('Reject!')
  }

}
test()

/* 실행결과 */
Reject!