[JavaScript] 예외처리

 

자바스크립트는 코드를 작성했을 때 ‘코드가 실행조차 되지 않는 오류’와 ‘코드 실행 중간에 발생하는 오류’라는 2가지 종류의 오류가 있다.

 

괄호 개수를 잘못 입력하는 등의 오류로 코드가 실행조차 되지 않는 오류를 ‘구문오류’라고 하고,

이러한 문법적 오류를 제외하고 코드 실행 중간에 발생하는 오류를 ‘예외’라고 부른다.

 

그리고 이를 처리하는 것을 ‘예외 처리’라고 부른다.

 

1. 오류의 종류

• 위에서 언급한 것처럼 오류에는 크게 2가지 종류가 있다.
  • 프로그램이 실행 전에 발생하는 오류 (구문오류)
  • 프로그램 실행 중에 발생하는 오류 (예외 / 런타임 오류)

 

1) 구문오류

• 괄호의 짝을 맞추지 않았다든지, 문자열을 열었는데 닫지 않았다든지 할 때 발생하는 오류다.
• 구문오류가 있으면 웹 브라우저가 코드를 분석조차 하지 못하므로 실행되지 않는다.
• Syntax Error를 만나는 모든 순간이 그렇다.

 

2) 예외

• 예외 또는 런타임 오류는 실행 중에 발생하는 오류를 의미한다.
• 프로그램이 먼저 실행되고, 해당 문장을 읽었으나 해결할 수 없는 문제일 때 에러로 오류를 보여준다.
• SyntaxError라고 출력되는 오류 이외의 모든 오류가 예외로 분류된다.
  • TypeError
  • ReferenceError
  • RangeError

 

 

 

2. 기본 예외 처리

• “조건문”을 사용해서 예외가 발생하지 않게 만드는 것을 기본 예외 처리라고 부른다.
• querySelector()메소드로 추출된 문서 객체가 없는 경우를 살펴보자.

document.addEventListener('DOMContentLoaded', () => {
	const h1 = document.querySelector('h1')
	h1.textContent = '안녕하세요'
})
//Uncaught TypeError가 발생한다.

document.addEventListener('DOMContentLoaded', () => {
	const h1 = document.querySelector('h1')
	if (h1) {
		h1.textContent = '안녕하세요'
	} else {
		console.log('h1태그를 추출할 수 없습니다')
	}
})
//조건문으로 에러 발생을 막았다

• 자바스크립트는 굉장히 유연한 언어이기 때문에 예외를 발생할 가능성이 적다.
  • 이를 막연하게 좋다고만 할 수는 없다. 프로그램에 문제가 발생했는데도, 실행하면 문제를 만들 가능성이 있다.

 

 

3. 고급 예외처리

• 예외를 조금 더 쉽게 잡을 수 있는 기능으로, try catch finally 구문이 있다.
  • try 구문 안에서 예외가 발생하면 catch 구문에서 처리하고, finally 구문은 예외 발생 여부와 상관없이 실행해야 하는 작업이 있을 때 사용한다.
• 이를 고급 예외 처리 방법이라고 부른다.

try {
 // 예외가 발생할 가능성이 있는 코드
} catch (exception) {
	//예외가 발생했을 때 실행할 코드
} finally {
	//무조건 실행할 코드
}

• finally 구문은 필수 사항은 아니고 예외 발생 여부와 상관없이 수행해야 하는 작업이 있을 때 사용한다.
  • 아래와 같은 상황일 때는 예외 구문이 완전히 다 실행되지 않을 수 있으므로 finally가 존재해야 안전하게 코드를 작성할 수 있다.
    • try catch 구문 내부에서 return 키워드를 만났을 때,
    • try catch 구문 내부에서 break 또는 continue 키워드를 만났을 때

 

 

4. 예외 객체

• try catch 구문을 사용할 대 catch의 괄호 안에 입력하는 식별자가 예외객체다.
• 아무 식별자나 입력해도 괜찮지만 일반적으로 e나 exception이라는 식별자를 사용한다.
• 예외 객체가 갖고 있는 속성은 브라우저에 다라 조금씩 다르지만, 모든 웹 브라우저는 name, message를 가지고 있다.

try {
	const array = new Array(99999999999)
} catch (e) {
	console.log(e)
}

 

 

 

5. 예외 강제 발생

• 예외를 강제로 발생시킬 때는 throw 키워드를 사용한다.

//단순하게 예외를 발생시킨다.
throw 문자열

//조금 더 자세하게 예외를 발생시킨다.
throw new Error(문자열)

• throw 구문을 사용하면 곧바로 예외를 발생하는 것을 볼 수 있다.
• 코드 실행 중에 throw 키워드를 사용하면 예외를 발생시키므로 프로그램ㅇ이 중단된다.
• 단순하게 문자열을 입력한 경우와 new Error() 형태의 코드를 사용한 경우의 출력이 약간 다르다.

throw '문자열'
//Uncaught 문자열

throw new Error('문자열')
//Uncaught Error : 문자열
// at ㅁ파일 이름 : 줄번호

function divide(a, b) {
	if (b === 0) {
		throw '0으로는 나눌 수 없습니다.'
	}
	return a / b
}
console.log(divide(10, 0))
//Uncaught 0으로는 나눌 수 없습니다.

 

 

 

• 예외를 강제로 발생시키는 이유는 무엇일까?
• 내가 만든 함수를 내가 사용할 때는 아무 문제없이 사용할 수 있겠지만, 내가 만든 함수를 다른 사람이 사용할 때는 내가 의도하지 않은 형태로 코드를 사용할 수도 있다.
• 이럴 때 예외를 강제로 발생시키면 사용자에게 주의를 줄 수 있으며, 의도한대로 처리하게 유도할 수도 있다.

function test(object) {
	if (object.a !== undefined && object.b !== undefined) {
		console.log(object.a + object.b)
	} else {
		throw new Error("a 속성과 b 속성을 지정하지 않았다.")
	}
}

test({})
// Uncaught Error : a 속성과 b 속성을 지정하지 않았다.

• 만약 위의 throw 구문이 없었다면 실행 결과는 단순히 ‘NaN’으로 처리된다.
  • 일반적인 프로그래밍 언어라면,
    • object 객체에 a 속성과 b 속성이 없으므로 예외가 발생하고,
    • 존재하지 않는 것을 더하므로 object.a + object.b를 할 때도 예외를 발생시킨다.
  • 하지만 자바스크립트는
    • object.a가 undefined로 나오고, object.b가 undefined로 나온다.
    • undefined + undefined 연산이 NaN으로 처리되는 것이다.
• 함수를 잘못 사용했다는 것을 강제로라도 인지시켜주기 위해서 예외처리는 반드시 필요하다.