지정한 조건의 결과 값이 참(true
)인 경우와 그렇지 않은 경우를 나누어서 코드를 실행한다.
프로그램 코드를 작성하다 보면 어떠한 조건에 따라서 실행문을 달리 할 필요가 있다. 복잡한 프로그램일 수록 이러한 코드의 전개가 두드러지며 매우 중요한 구문이다.
기본적인 작성 형식은 다음 몇 가지가 있다.
if (condition) {
// 조건의 결과가 true일 경우 실행할 코드
}
if (condition) {
// 조건의 결과가 true일 경우 실행할 코드
} else {
// 조건의 결과가 false일 경우 실행할 코드
}
if (condition A) {
// 조건 A의 결과가 true일 경우 실행할 코드
} else if (condition B) {
// 조건 B의 결과가 true일 경우 실행할 코드
} else {
// 조건 A와 B가 모두 false일 경우 실행할 코드
}
if (condition A) {
// 조건 A의 결과가 true일 경우 실행할 코드
if (condition A2) {
// 조건 A2의 결과가 true일 경우 실행할 코드
} else {
// 조건 A2의 결과가 false일 경우 실행할 코드
}
} else if (condition B) {
// 조건 B의 결과가 true일 경우 실행할 코드
} else {
// 조건 A와 B가 모두 false일 경우 실행할 코드
}
if (조건식) 에서 조건식에 들어가는 연산자에 대해 알아보자. 괄호안의 조건식의 결과는 자동으로 boolean
값으로 형변환이 되며 평가된다.
if (원래 값) | boolean 결과 | 비고 |
---|---|---|
if ("0") | true | |
if ("1") | true | |
if (0) | false | 숫자 0의 경우 |
if (1) | true | 숫자 1의 경우 |
if ("foo") | true | |
if (false) | false | |
if (true) | true | |
if (undefined) | false | |
if (NaN) | false | |
if ("") | false | 빈 문자열의 경우 |
비교 연산자 | x = 10 일 경우 | boolean 결과 | 비고 |
---|---|---|---|
> | if (5 > x) | false | 5는 10(x)보다 작아야 하므르 거짓 |
>= | if (5 >= x) | false | 5는 10(x)보다 크거나 같아야 하므로 거짓 |
< | if (5 < x) | true | 5는 10(x)보다 작아야 하므로 참 |
<= | if (5 <= x) | true | 5는 10(x)보다 작거나 같아야 하므로 참 |
== | if (10 == x) | true | number 타입의 10과 10(x)은 같아야 하므르 참 |
!= | if (10 != x) | false | number 타입의 10과 10(x)은 같지 않아야 하므로 거짓 |
=== | if ("10" === x) | false | string 타입의 10과 number 타입의 10(x)은 값과 타입이 모두 같아야 하는데 타입이 다르므로 거짓 |
!== | if ("10" !== x) | true | string 타입의 10과 number 타입의 10(x)은 값 또는 타입이 달라야 하는데 타입이 다르므로 거짓 |
논리 연산자 | x = 10일 경우 | boolean 결과 | 비고 |
---|---|---|---|
&& | if (11 > x && x !== "10") | true | 11은 x 보다 크고 string 타입의 "10"과는 타입이 다르므로 양쪽 모두 결과값이 true이며 논리 연산의 결과는 true |
|| | if (11 > x || x === "10") | true | 11은 x 보다 크므로 참이고 string 타입의 "10"과는 타입이 다르므로 거짓이지만 한쪽이 true이므로 논리 연산의 결과는 true |
분기되어 실행되는 실행문이 한줄인 경우에 한해서는 '{ }'를 생략할 수 있다.
if (condition) // 조건의 결과가 true일 경우 실행할 코드 ;
else // 조건의 결과가 false일 경우 실행할 코드 ;
if 명령문의 단축 형태로 아래와 같이 삼항 연산자를 사용할 수 있다.
// x가 60보다 작으면 true이며 그 외는 false
let result = x < 60 ? "불합격" : "합격";
위의 코드를 if 문으로 재작성하면 아래와 같다.
let result;
if (x < 60) {
// 조건의 결과가 true일 경우 실행할 코드
result = "불합격";
} else {
// 조건의 결과가 false일 경우 실행할 코드
result = "합격";
}