프론트/Javascript

자바스크립트 에러 핸들링 방법 좀 더 공부하기

척척박사또라에몽 2022. 6. 13. 16:47

https://velog.io/@cookie004/%EB%B2%88%EC%97%AD-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%97%90%EB%9F%AC-%ED%95%B8%EB%93%A4%EB%A7%81-%EB%B0%A9%EB%B2%95-%EC%86%8C%EA%B0%9C

 

[번역] 자바스크립트 에러 핸들링 방법

자바스크립트에서 에러 핸들링은 간단하지만 종종 미스테리하고 복잡하게 느껴집니다. 피할 수 없으면 즐기지(?) 말고 핸들링하자! 자바스크립트의 Error 객체, 예외를 발생시키고 핸들링 할 수

velog.io

 

export default function App () {
  function sum(a, b) {
    if (isNaN(a) || isNaN(b)) {
      throw new TypeError('Value is not a number.');
    }
    return a + b;
  }
  useEffect(()=>{
    try {
      try {
        console.log( sum(1, 'a') );
      }
      catch (err) {
        console.log('first:',err.message)
        console.error('First error caught', err.message);
        throw new Error('Second error', { cause: err });
      }
    }
    catch (err) {
      console.log('second:',err.message)
      console.error('Second error caught', err.message);
      console.error('Error cause:', err.cause.message);
    }
  },[])
  return (
    <div>javascript error handle</div>
  )
}

저 코드를 실제로 돌리면 이렇게 나오더라고요

throw "Too big" //. throw a text
throw 500 // throw a number

이런식으로 예외(exception)은 string, number, boolean, object 등등.. 여러가지 형태로 보낼 수 있습니다.

이런식으로 catch(err)에는 throw new Error(여기 안에 던진 값이 들어갑니다)