본문 바로가기
WEB front-end/Javascript

예외처리...

by 겸둥이곰 2022. 6. 2.
반응형

코딩을 하다보면 종종 실수를 하는데..

무슨 자신감인지.. Jvascript 코딩할 때는 예외처리를 종종 하지 않은 경우가 있다.

Javascript는 애러 발생시 스크립트가 더이상 실행이 되지 않고 콘솔에만 애러 내용이 출력이 된다.

이때, 사용자는 이유를 알수없고 화면은 그냥 멈춘다.

이것을 방지하기 위해 try.. catch 를 사용하여 스크립트가 죽는 걸 방지하고, 에러시에 적절한 안내 등 뭔가를 할수 있다.

 

* 문법

try{
    // 코드
}catch(err){
    // 에러 핸들링
}

기본 문법은 간단하다. 

try{...} 내에 코드를 실행하고 이상이 있으면 catch(err) {..} 로 이동하며, err 변수에 에러 내용을 전달함 (이때 err의 명칭은 아무거나 상관이 없음).

** 주의할점
 - catch에 걸렸는데 아무런 코드를 작성하지 않고 넘어가면 에러를 전혀 감지하지 못함. (가끔 이렇게 코딩하는 사람들이 있음.. -_-;;;)

 

* 예외사항
 - try... catch..는 동기적으로 작동하기 때문에  setTimeout처럼 스케쥴된 코드에서 발생한 예외는 잡을 수 없다.
 - 이런 경우는 setTimeout 내에 try.. catch..를 구현해야 한다... (사실 이렇게 잘 사용하지 않아서.. 최근에서야 알게되었다.. )

setTimeout(()=> {
    try{
        // 코드
    }catch(err){
        // 에러 핸들링
    } }, 1000);

* throw 연산자 
 - 실제 javascript가 오류인 경우는 당연히 오류가 발생해서 catch로 넘어 가겠지만.. 
 - 어떤 값을 부재라던지.. 논리적인 오류가 발생할 경우... (문장 실행항 에러는 없음..) 이때는 직접 에러를 만들어서 알려줄 수 있음.

throw <error object>

throw new Error(message);
throw new SyntaxError(message);
throw new ReferenceError(message);
throw new TypeError(message);

등등.. 으로 나누어서 발생을 시킬 수 있으나... 그냥 Error로 던져도 무방하다.. 

 

* finally
 - try{...} 구문이 이상없이 끝난경우
 - catch{...} 구문이 실행이 끝난경우... 
 - 항상 맨 마지막에 실행이 됨... 

try{
    // 1 번째.. 실행..
}catch(err){
    // 에러 발생 시 실행..
}finally{
    // 맨 마지막에 실행 됨..
}

* 전역 catch
 - 만약 try... catch.. 로 감싸지 않은 바깥 영역에서 에러가 발생한 경우..
 - 이 경우는 스크립트가 죽는것을 방지 할 수는 없고.. 주로 개발자에게 애러 내용을 전달하는 용도로 사용

window.onerror = function(message, url, line, col, error){
    alert(`${message} \n ${line}:${col} of ${url}`);
};

function throwErr(){
    throw new Error("오류 발생");
}

throwErr();

깔끔한 오류처리 ~~ 화이팅~~!!!

반응형

'WEB front-end > Javascript' 카테고리의 다른 글

Map  (0) 2022.06.20
fetch  (0) 2022.06.03
async/await  (0) 2022.05.27
promise  (0) 2022.05.27
호이스팅(hoisting)  (0) 2022.05.26

댓글