상세 컨텐츠

본문 제목

[javascript] 조건문

Web/Javascript

by 클리엘 클리엘 2020. 3. 17. 18:10

본문

1. if

 

가장 자주 사용되는 조건문으로 참/거짓에 따라 처리를 분기하여 실행합니다.

var i = 10;

if (i == 10) {
	alert('i는 10');
}
else {
	alert('i는 10이 아님');
}

조건은 if 다음에 괄호를 통해 넣으며 조건이 참이면 바로 아래 문장을, 거짓이면 else 이하 문장을 실행하게 됩니다. 각 실행 문장이 단 한 줄인 경우 중괄호({})는 생략할 있으며 거짓인 경우에 그 어떤 처리도 필요하지 않으면 else자체도 생략할 수 있습니다.

var i = 10;

if (i == 10)
	alert('i는 10');

조건이 2개 이상 필요하다면 else if 문을 사용할 수 있습니다.

var s = prompt('입력하세요.', '');
var i = Number(s);

if (i < 10) {
	alert('i는 10미만 입니다.');
}
else if (i >= 10) {
	alert('i는 10이상 입니다.')
}
else {
	alert('숫자가 아니거나 오류임');
}

위 예제에서 입력된 값에 따라 2개의 조건을 통해 분기하여 처리하고 있습니다. 마지막에 else는 이전에 존재하는 모든 조건이 맞지 않는 경우에 실행하는 부분이지만 필요하지 않다면 역시 생략이 가능합니다.

 

조건문을 작성할때는 다음 논리 연산자인 &와 |를 사용해 2가지 이상의 조건을 처리할 수 있습니다.

var s = prompt('입력하세요.', '');
var i = Number(s);

if (i >= 10 & i <= 20)
	alert('i는 10과 20사이');
else
	alert('그 외');

&는 비교 대상 모두가 참인경우에만 실행되고 |연산자는 둘 중 하나만 참 이어도 실행됩니다. 그런데 이 연산자는 &&과 ||으로 바꾸어 작성할 수도 있습니다. 동작은 동일합니다.

var s = prompt('입력하세요.', '');
var i = Number(s);

if (i >= 10 && i <= 20)
	alert('i는 10과 20사이');
else
	alert('그 외');

그렇다면 하나만 쓰는 경우와 2개를 같이 쓰는 경우는 무슨 차이일까?

 

논리 연산자를 하나만 쓰는 경우에는 무조건 비교대상을 모두 확인합니다. 예컨데 & 연산자를 사용하는 경우 i >= 10과 i <= 20이 있으면 i가 10과 같거나 10보다 큰지 확인하고 i 가 20과 같거나 더 작은 지를 모두 확인해서 2가지 조건이 참이면 실행하게 됩니다.

 

하지만 && 연산자를 적용하면 좌변에 있는 조건이 참인 경우에만 우변의 조건을 확인하게 됩니다. 이 논리가 가능한 이유는 &(and) 연산자는 모두 참인 경우에만 실행해야 하기에 좌변의 조건이 거짓이 되면 우변의 결과가 어떻든 실행이 불가능하기 때문입니다.(좌변이 거짓이면 우변을 확인해볼 필요가 없습니다.) 따라서 &&연산자를 사용하면 경우에 따라 불필요한 비교 동작을 생략할 수 있는 셈입니다.

 

||연산자도 마찬가지입니다. 좌변이 만약 참이라면 우변을 확인할 필요가 없죠. 둘중 하나만 이라도 참이면 실행이 가능하니 말입니다.

 

2. switch

 

switch는 값의 결과에 따라 여러처리로 분기하는 조건문입니다.

var s = prompt('입력하세요.', '');
var i = Number(s);

switch (i)
{
	case 10:
		alert('i는 10');
		break;
	case 100:
		alert('i는 100');
		break;
	default:
		alert('그외');
		break;
}

switch의 괄호안에 값을 case로 비교하여 일치하는 결과에 따라 처리를 진행하고 있습니다. 마지막에 default는 이전에 존재하는 case와 단 하나도 일치하는 것이 없으면 실행하는 부분으로서 필요하지 않다면 생략이 가능합니다.

 

case이하 실행문에서는 코드가 여러줄이라 하더라도 중괄호가 필요하지 않으며 if 때처럼 비교 연산자를 사용할 수도 있습니다.

var s = prompt('입력하세요.', '');
var i = Number(s);

switch (true)
{
	case i == 10:
		alert('i는 10');
		break;
	case i >= 100:
		alert('i는 100이상');

		if (i >= 1000) {
			alert('i는 1000d이상!!!');
		}
		break;
	default:
		alert('그외');
		break;
}

switch문을 사용할때 주의해야 할 점이 있습니다. switch문 안에 있는 case는 '이것만 실행하세요.'가 아니라 '여기서부터 실행하세요'라는 개념일 가지고 있습니다. 때문에 case와 default안에 보면 마지막에 break가 있는데 이것은 조건에 맞는 case문만 실행시킬 수 있도록 하기 위한 것입니다. 조건문이나 반복문에서 break를 만나면 처리를 중지하는 특징을 이용하는 것이죠.

 

만약 break를 생략하게 되면 예컨데 위 예제에서 case i == 10 조건에 break를 생략하면 i == 10조 건이 실행된 후 i >= 100에 있는 처리 문도 같이 실행하게 됩니다. '~부터 이하 모든 걸 실행한다.'는 case의 특징 때문입니다. 따라서 특정 조건의 case만 실행하기를 원한다면 각 case분기 마지막에는 꼭 break문을 넣어야 합니다.

'Web > Javascript' 카테고리의 다른 글

[javascript] 함수  (0) 2020.03.27
[javascript] 반복문  (0) 2020.03.24
[javascript] 조건문  (0) 2020.03.17
[javascript] 기본 사항  (0) 2020.03.13
[javascript] 개요  (0) 2020.03.12

관련글 더보기

댓글 영역