[JavaScript] 자바스크립트 제어문 1 (조건문)

제어문은 프로그램의 흐름을 제어할 수 있게 해주는 문법으로 조건식을 만족하는지 여부에 따라 코드를 제어할 수 있는 조건문과 변수에 일치하는 경우의 값에 따라 코드를 제어할 수 있는 선택문 그리고 특정 코드를 여러번 반복 실행 시켜주는 반복문이 있다.

 

조건문에는 if문, esle 문, else if문 등이 있다.

 

---

if 문

if문은 조건식을 만족하는 경우에만 실행하며 조건문이 만족하지 않는다면 if문을 건너띄고 다음 명령어로 넘어가게 된다.

 

if(조건식){
  자바스크립트 코드;
}

위 코드는 if문의 기본 형식이다.

 

var num = 10;
if(num > 9){
  document.write("10은 9보다 큽니다.");
}

위의 코드를 보면 if문의 조건식에서 num이 9보다 큰지 검사하고 조건식이 참이라면 if문 안에 있는 document.write코드를 실행하게 된다.

 

var num = 1;
if(num) {
  document.write(num);
 }		//true
  
var num = 0;
if(num) {
  document.write(num);
 }		//false

위 코드는 if문 안에 같은 num을 조건식으로 주지만 각각의 num은 1과 0으로 값이 다르다.

위의 코드는 조건식이 만족하여 num을 출력하지만 아래 코드는 조건식이 만족되지 않아 num이 출력되지 않는다.

그 이유는 조건식에 들어가는 값이 true와 false를 반환하는 Boolean값이 아닌경우

0, null, ""(빈 문자), undefined는 false를 리턴하지만 그 외에 값은 true를 리턴하게 되어 num이 1이면 true, num이 0이면 false를 리턴하게 되는 것이다.

 

---

else 문

else문은 if문 뒤에 따라오며 if문의 조건식이 만족하지 않는 경우 else 문이 실행된다. 즉 if문이 false 일 경우 실행되게 된다.

 

if(조건식){
  자바스크립트 코드;
 } else {
  자바스크립트 코드;
 } 

위 코드의 형식이 else 문의 기본 형식으로 if문의 조건식이 맞지 않다면 else문이 실행되게 된다.

var num = 10;
if(num > 20) {
  document.write("10은 20보다 큽니다.");
 } else {
  document.write("10은 20보다 크지 않습니다..");
 }

위의 코드를 보면 if문의 조건식은 false이므로 else문으로 넘어가서 else문 안에 있는 코드를 실행하게 된다.

 

 

---

else if 문

else if문은 두 가지 이상의 조건식과 정해 놓은 조건을 만족하지 않을 때 실행되는 코드이다.

if(조건식 1) {
  자바스크립트 코드;
 } else if(조건식 2) {
   자바스크립트 코드;
 } else if(조건식 3) {
   자바스크립트 코드;
 } else {
  자바스크립트 코드;
 } 
 

위의 코드가 else if문의 기본형식으로 if문의 조건식이 맞지 않다면 else if문의 조건식2로 조건식2도 맞지않다면 조건식3으로 조건식 3도 맞지않다면 else문이 실행되게 된다.

 

var num = 10;

if(num == 20) {
  document.write("10은 20과 같습니다..");
 } else if(num == 10) {
  document.write("10은 10과 같습니다.");
 } else {
  document.write("위의 조건식 중 맞는 조건식이 존재하지 않습니다.");
 } 

if문의 조건식과 비교하여 false를 반환하고 다음 else if문에 조건식은 true를 반환하기 때문에 else if문을 실행하고 else문은 실행하지 않고  구절을 벗어나 다음 명령어를 실행하게 된다.

 

 

---

중첩 if문

조건문 안에 또 다른 조건문이 있는 경우이다. 

if(조건식1) {
  if(조건식2) {
  자바스크립트 코드;
  }
 } 

위 코드는 중첩 if문의 기본 형식으로 첫 번째 if문이 true이고 두 번째 if문도 true이면 코드가 실행된다.

 

var num1 = 10;
var num2 = 20;

if(num1 == 10) {
 if(num2 == 20) {
   document.write("num1은 10이고, num2는 20입니다.");
  }
 } else{
 	 document.write("num1은 10이 아닙니다.);
  }

 

위의 코드를 보면 첫 번째 if문과 두 번째 if 문의 결과가 true이면 두 번째 if문 안에 있는 document.write문이 실행되고

첫 번째 if문이 거짓이라면 else 문이 첫 번째 if문은 true지만 두 번째 if문은 false일 경우 아무것도 실행되지 않는다. 

 

 

 

"본 포스팅은 필자가 공부한 것을 정리해놓은 것으로 오류가 있을 수 있습니다."