조건문이란 특정한 조건 아래서만 코드가 실행되게 하는 구문을 말합니다. 로그인 되어있는 상태에서만 댓글을 남길 수 있게 하는 상황 등에 사용됩니다.
var a = 20;
if (a > 10) {
alert('10보다 큼'); //alert함수는 메시지를 띄웁니다.
}
a가 10보다 큰 상황에서만 10보다 크다고 alert합니다. alert함수는 인자로 넣은 문장을 브라우저에 메시지로 띄웁니다. 지금 a가 20이니까 a > 10이 true가 되어 alert 함수가 실행됩니다.
else나 else if를 사용해서 조건을 구체화할 수도 있습니다. else는 if 조건이 flase일 때 실행됩니다. else if는 조건을 여러개로 하고 싶을 때 실행됩니다.
if(a > 10) {
alert('10보다 큼');
} else {
alert('10보다 작거나 같음');
}
if (a > 10) {
alert('10보다 큼');
} else {
alert('5보다 큼');
} else {
alert('5보다 작거나 같음');
}
if안의 조건은 true이면 실행된다고 했죠? 근데 true인 경우가 생각보다 많습니다. 이전 시간 비교연산자를 배울 때 ==의 오류에 대해 알아보았습니다. 문제는 if의 조건을 체크하는 방식이 == 비교연산자의 계산과 같다는 겁니다. 0, -0 , null, false, NaN, undefined, ''의 값을 가지면 false이고 나머지 값을 가지면 전부 true입니다. 이상한 게 false == [ ] 이지만 if ([ ])는 실행 됩니다.
if(0) {
alert('실행 안 됨');
}
if ('') {
alert('실행 안 됨');
}
if ([]) {
alert('실행 됨');
}
간단한 if else문은 삼항연산자로 바꿀 수 있습니다. 한 줄로 줄일 수 있어 편합니다.
var i = 10, j;
if (i > 10) {
j = 15;
} else {
j = 5;
}
var j = i > 10 ? 15 : 5;
switch (c) {
case 10: // c가 10일 때
alert('c는 10');
break;
case 9: // c가 9일 때
alert('c는 9');
break;
case 8: // c가 8일 때
alert('c는 8');
break;
default: // 위의 경우에 해당하지 않을 때
alert('그 외');
}
case 뒤에 c에 해당하는 조건을 적고 그 아래에 실행할 내용을 적습니다.
default는 어떤 조건에도 해당이 안 될 때 실행됩니다.
else와 비슷합니다. 조심할 점은 case하나마다 내용 밑에 break;을 적어줘야합니다.
break을 적지 않으면 해당 case 아래로 모든 내용이 실행됩니다.
switch문을 다음과 같이 if ~ else구문으로 바꿀 수 있습니다.
if ( c === 10) {
alert('c는 10');
} else if (c === 9) {
alert('c는 9');
} else if ( c === 8) {
alert('c는 8');
} else {
alert('나머지');
}