자바스크립트의 if else 조건절은 거짓일 때도 코드를 실행한다. if 절에 사용되는 조건식이 참이면 if 절에 있는 코드를 실행하고 조건식이 거짓이면 else 절에 있는 코드를 실행한다. 이것은 참과 거짓을 떠나 조건식에 맞지 않는 경우에도 코드를 실행하여 사용자에게 원하는 값을 보여주도록 하는데 있다.
자바스크립트 if else 조건 사용 방법
using javascript if else statement
자바스크립트의 사용 목적은 웹페이지를 동적인 움직임을 주는 것이다. 정적인 웹페이지에 동적인 요소를 추가하여 사용자와 상호작용을 하는데 있다.
웹페이지는 사용자의 입력에 따라 동작을 하고, 사용자가 원하는 결과를 얻을 수 있도록 해 주는 것이 목적이기도 하다.
사용자가 원하는 결과를 얻기 위해 자바스크립트는 분기를 사용하는데 이 분기는 if 문을 이용한 조건을 사용한다.
결과값이 참일 때 코드를 실행하는 if 문의 구조상 조건이 거짓일 때의 상황에도 값을 표현할 필요가 있다.
이런 경우 else 구문을 추가하여 거짓일 떄의 자바스크립트 코드를 실행하도록 하면 된다.
if else 조건 사용 방법
if 조건절을 사용하는 것은 어렵지 않다.
조건식을 사용하여 참일 경우 if 절의 코드가 실행된다.
조건식이 거짓이라면 else 절의 코드가 실행된다.
if else 를 사용하기 위한 조건식은 비교연산자와 논리연산자를 같이 사용하면 된다.
if(조건식) {
// 참일 때 코드실행
} else {
// 거짓일 때 코드실행
}
샘플코드
위에서 언급한 자바스크립틔 if else 절을 이용하여 예제를 만들어 본다.
이전에 사용한 코드를 그대로 사용했지만 if 조건절에 else 를 추가하여 출력되는 문자열을 조금 변경했다.
조건문은 if else 의 동작을 다시 언급하면 다음과 같다.
if 절에 작성한 조건식이 참이면 if 구문의 코드를 실행한다.
if 절에 작성한 조건식이 거짓이면 else 구문의 코드를 실행한다.
<!DOCTYPE html>
<html>
<body>
<script>
let _boolean
console.log('----------');
let vA = 10;
let vB = 100;
let _isTrue = false;
let _text = '';
console.log("vA 가 %s 이고, vB 가 %s 일때 비교 ", vA, vB);
console.log('----------');
_isTrue = Boolean(vA > 50 && 50 > vB);
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("vA > 50 && 50 > vB : %s %s", _text, _isTrue);
_isTrue = Boolean(vA > 50 || 50 > vB);
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("vA > 50 || 50 > vB : %s %s", _text, _isTrue);
_isTrue = Boolean(vA == vB);
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("(vA == vB) : %s %s", _text, _isTrue);
_isTrue = Boolean(!(vA == vB));
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("!(vA == vB) : %s %s", _text, _isTrue);
_isTrue = Boolean(vA != vB);
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("(vA != vB) : %s %s", _text, _isTrue);
_isTrue = Boolean(!(vA != vB));
if (_isTrue) {
_text = "참";
} else {
_text = "거짓";
}
console.log("!(vA != vB) : %s %s", _text, _isTrue);
console.log('----------');
</script>
</body>
</html>
코드가 길다. if else 절의 구문이 길어졌기 때문이고, 조건식이 필요이상으로 많기에 코드가 길어졌을 뿐이다.
조건식과 if else 구문만 보면 된다.
결과 화면을 보자.
변수에 들어간 값에 대한 조건식이 참이면 참을 출력할 것이다.
조건식이 거짓이라면 거짓을 출려하게 될 것이다.
'programming > javascript' 카테고리의 다른 글
자바스크립트 선택 조건 switch case 사용 방법 using javascript switch case statement (0) | 2022.04.19 |
---|---|
자바스크립트 조건문 else if 조건 여러개 사용 방법 using javascript conditon else if statement (0) | 2022.04.17 |
자바스크립트 if 조건문 사용 using javascript if condition Statement (0) | 2022.04.11 |
자바스크립트 삼항연산자 사용 using javascript ternary operator (0) | 2022.04.09 |
자바스크립트 논리연산자의 사용 using javascript logical operators (0) | 2022.04.06 |
댓글