자바스크립트(javascript) 에서 try~catch 활용 예제
자바스크립트(javascript) 에서 try~catch 활용 예제
REDINFO
몇달 전 2024-01-14 22:28:42

자바스크립트를 사용하다보면 런타임 중 에러를 무시하고 다음 라인을 실행해야 하는 경우가 발생한다.  이때 사용할 수 있는건 사전에 에러 발생이 안나도록 변수나 함수의 타입을 검증하는 예외처리가 필요하지만 try 블록을 이용하여 처리를 회치할 수 있다.

 

사실 try~catch 는 에러를 보완할 수 있는 수단이라기 보단 에러는 회피하는 용도로 사용되고, 커스텀 조건을 처리하기위한 용도로 사용해야한다. 무조건 에러를 회피하다보면 원치 않은 결과를 얻을 수 있기때문에 사용해야 한다면 catch 를 통해 예외처리를 해주어야 한다. 

 

그럼 try 블록을 사용하는 간단한 예제에 대해 알아 보도록 하자 

 

TRY블록으로 일반적인 에러를 회피하는 예제
function a(arr,arr2){
	try{ if( arr.length == 0 ){ arr = new Array(); }} catch(e){}
	try{ if( arr2.length == 0 ){ arr2 = new Array(); } catch(e){}
	console.log(arr); // null
	console.log(arr2); // (3)[1, 2, 3]
}
a(null,[1,2,3]);

 

변수의 예측이 정말 어렵다면 try 블록으로 감싸서 처리하면 좋겠지만 되도록 아래와 같이 예외 처리를 해주는게 좋다.

| 올바른 예외처리

function a(arr,arr2){
	if( !arr || arr.length == 0 ){ arr = new Array(); }
	if( !arr2 || arr2.length == 0 ){ arr2 = new Array(); }
	console.log(arr); // null
	console.log(arr2); // (3)[1, 2, 3]
}
a(null,[1,2,3]); 

 

만약 try 블록으로 감싸서 아래와 같이 처리한다면 원하는 결과를 추출 할 수 없으며 또다른 에러를 만나게 된다.

| 잘못된 예 

function a(arr,arr2){
	try{ 
		if( arr.length == 0 ){ arr = new Array(); }
		if( arr2.length == 0 ){ arr2 = new Array();}
	} catch(e){}
	arr.push(1); // Uncaught TypeError: Cannot read properties of null (reading 'push')
}
a(null,[1,2,3]);

 

TRY 블록을 이용한 일반적인 예외 처리
function a(arr){
	try{ 
		if( arr[0] != '사과'){ throw "첫번째 입력항목이 사과가 아닙니다.";}
		if( arr[1] != '딸기'){ throw "두번째 입력항목이 딸기가 아닙니다.";}
	} catch(e){	
		console.log(e);
		return false;
	}
	console.log('성공');
}
a(['사과','오렌지']);

 

위의 예제는 배열 인자를 받아서 처리하는 예제로 입력값에 따라 실행을 멈춰야 하는 프로그램에서 사용할 수 있다. 예를 들면 특정 입력값을 저장하는 프로그램에서 필 수 값을 체크하는데 사용이 가능하다.  

 

추가로 실제 타입 에러등이 발생된 디버깅 에러처럼 처리하기위해선 아래의 예제처럼 `throw new Error`을 사용하면 된다. 

// try 블록의 catch문 에러를 보기좋게 뿌려준다.
function catchObj(error){
	var ret = {line:null,column:null,message:null};
	if( typeof error.stack != 'string'){ error.stack = ''; }
	var match = error.stack.match(/(\d+):(\d+)/);
	if(match) {
		ret.line = match[1];
		ret.column = match[2];
	}
	if( typeof error.message == 'string'){ ret.message = error.message; }
	return ret;
}	
function a(arr){
	try{ 
		if( arr[0] != '사과'){ throw new Error('첫번째 입력항목이 사과가 아닙니다.'); }
		if( arr[1] != '딸기'){ throw new Error('두번째 입력항목이 딸기가 아닙니다.'); }
	}catch(e){	
		console.log(catchObj(e)); // {line: '16', column: '30', message: '두번째 입력항목이 딸기가 아닙니다.'}
		return false;
	}
	alert('성공');
}
a(['사과','오렌지']);

 

위의 예제를 보면 `catchObj` 함수가 추가된것을 볼 수 있는데 해당 함수는 catch문으로 return 되는 `e`인자를 활용하여 e.stack 을 매칭한 후 해당 라인과 칼럼 수를 얻을 수 있다. (간단하게 만든거니 실제 사용시 테스트 해보는게 좋다.)

 

기본적으로 jvascript 는 런타임된 스크립트의 현재 라인을 가져올 수 있는 기능을 제공하지는 않지만 try 블록을 이용하면 꼼수? 같은 방법을 통해 라인수를 가져올 수 있으니 참고하여 사용하도록 하자. 

이 포스트글이 도움이 되었나요?
0
카테고리 연관글

Comment

댓글작성

0(500) | 1(30)