[JavaScript] 자바스크립트 조건문 사용하기 (if)

2021. 5. 3. 18:46Program/JavaScript

014 _ 자바스크립트 조건문 사용하기 (if)

[적용]

  • 조건을 만족하는 데이트를 처리하고 싶을 때

[내용]

프로그램의 내부 구조를 확인해 보면 조건에 따른 처리가 이루어지는 작업이 많다.

자바스크립트는 'if/else'를 사용하여 조건에 따른 처리가 가능하다.


[문법]

구문 의미
if (조건1) {처리1} 조건1 O -> 처리1 실행
else if (조건2) {처리2} 조건1 X, 조건2 O -> 처리2 실행
else {처리3} 조건1 X, 조건2 X -> 처리3 실행

[예시1]

상수의 값에 따라 세 종류의 알림창을 띄우는 샘플 코드를 살펴보자.

상수 myPrice에 100을 대입하면, 'myPrice >= 50'은 참이 되므로 if 문의 처리 내용이 실행되고

else if 와 else문은 실행되지 않는다.

 

JavaScript

const myPrice = 100;

if (myPrice >= 50) {
    alert('myPrice는 50 이상입니다.');
} else if (myPrice > = 10) {
    alert('muPrice는 10 이상 50 미만입니다.');
} else {
    alert('myPrice는 10 미만입니다.');
}

// myPrice의 값이 50 이상이므로 첫번째 if의 처리내용이 실행된다.

[예시2]

else if와 else는 필요에 따라 구문의 생략도 가능하다.필요에 따라 else if를 생략한 다음 예제를 통해 확인해 보자.

 

JavaScript

// 참일경우 'Hello'를 출력합니다. 거짓인경우 출력을 생략합니다.
if (true) {
    alert('Hello');
}

// 조건이 두가지 일경우 else if의 생략이 가능합니다.
const rendomNum = Math.random() * 10;

if (randomNum >= 5) {
    alert('randomNum는 5 이상입니다.');
} else {
    alert('randomNum는 5 미만입니다.');
}

[예시3]

블록 내의 처리 내용이 한 줄이라면{}의 생략이 가능하다.

하지만 한 줄 이상이라면 생략이 불가능하다.

생략하여 코드를 작성하면 코드가 짧아지지만, 가독성이 떨어질 수 있으므로 주의해야 한다.

 

JavaScript

const rendomNum = Math.random() * 10;

if (randomNum >= 5) alert('randomNum는 5 이상입니다.');

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김