자바스크립트 조건문 if, if else, if else if 간단한 정리


자바스크립트 if 조건문은 조건식이 참일 경우 코드가 실행됩니다. if else 조건문은 조건식이 참/거짓일 경우 각각 실행 코드를 지정할 수 있습니다. if else if 조건문은 두 개 이상의 조건식을 설정할 수 있습니다.

자바스크립트 조건문 종류

자바스크립트 조건문은 ifswitch로 나눌 수 있습니다. switch 문은 다른 글에서 살펴보기로 하고, 이번 단락에서는 if문을 중심으로 간단하게 펴보겠습니다. if문은 다시 if, if else, if else if로 나눌 수 있습니다.


자바스크립트 if 조건문

자바스크립트 if 조건문은 if ( 조건식 ) 영역이 이면, { } 코드 블록 사이의 실행문을 1회 실행합니다. if ( 조건식 ) 영역이 거짓이면, if문을 탈출합니다.

<script>
  if ( 조건식 )
  {
    실행문 A;    //조건식이 참이면 실행
  }
  ...
</script>

입력받은 숫자가 0보다 크거나 같으면, '양수'를 출력하는 if 조건문입니다. prompt() 함수는 자바스크립트에서 사용자로부터 데이터를 입력받을 수 있는 간단한 함수로써 사용 방법은 하단 내부 참조를 참고합니다.

<script>
  var num = prompt("0 이상의 숫자를 입력하세요.", "");

  if ( num >= 0)
  {
    document.write( "입력한 숫자는 0 또는 양수입니다." );
  }
</script>


if 조건문은 조건을 만족하지 않는 값에 대해서는 설정을 할 수 없습니다. 위 예제의 경우 음수를 입력하면 아무런 코드가 실행되지 않습니다. 그래서 else 구문을 삽입하면 거짓일 경우에 실행될 코드를 지정 할 수 있습니다.

자바스크립트 if else

자바스크립트 if else 조건문은 if ( 조건식 ) {} 코드 블록에는 일 경우의 실행 코드를 입력합니다. else {} 코드 블록에는 if ( 조건식 )거짓일 경우 실행될 코드를 입력합니다.

<script>
  if ( 조건식 )
  {
    실행문 A;      //조건식이 참일 경우 실행
  }
  else
  {
     실행문 B;     //조건식이 거짓일 경우 실행
  }
</script>

조건식이 일 경우 '0 또는 양수'가 출력됩니다. 조건식이 거짓일 경우 '음수'라는 메시지가 출력되는 if else 조건문입니다.


<script>
  var num = prompt("원하는 숫자를 입력하세요.", "");

  if ( num >= 0)
  {
    document.write( "입력한 숫자는 0 또는 양수입니다." );
  }
  else
  {
    document.write( "입력한 숫자는 음수입니다." );
  }
</script>

if else 조건문은 하나의 조건식에 대해서 참/거짓에 대한 경우의 수에는 사용할 수 있습니다. 하지만 조건식을 두 개 이상 사용할 경우 아래와 같은 else if 구문 삽입이 필요합니다.

자바스크립트 if else if

자바스크립트 if else if 조건문은 두 개 이상의 조건식을 사용하고 싶을 때 사용할 수 있는 조건문입니다. if, else if, else의 세 가지 형태의 명령어를 모두 사용합니다.

if ( 조건식 A )이면, if {} 코드 블록 내부의 실행문 a가 작동합니다. 조건식 A거짓일 경우 else if ( 조건식 B )로 이동합니다. 조건식 B이면, else if { } 코드 블록 내부의 실행문 b가 실행됩니다. 조건식 B거짓이면 else { } 코드 블록 내부의 실행문 c가 마지막으로 실행됩니다.


<script>
  if ( 조건식 A )
  {
    실행문 a;          //조건식 A가 참일 때 실행
  }
  else if ( 조건식 B )
  {
    실행문 b;          //조건식 A가 거짓, 조건식 B가 참일 때 실행
  }
  else
  {
    실행문 c;          //조건식 A와 B가 모두 거짓일 때 실행
  }
</script>

입력한 숫자의 크기에 따라서 조건식을 삽입한 else if 예제입니다.

<script>
  var num = prompt( "원하는 숫자를 입력하세요.", "" );

  if ( num >= 100 )
  {
    document.write ( "입력한 숫자는 100 이상입니다." );
  }
  else if ( num >= 50 )
  {
    document.write ( "입력한 숫자는 50 이상, 99 이하입니다." );
  }
  else if (num >= 0 )
  {
    document.write ( "입력한 숫자는 0 이상, 49 이하입니다." )
  }
  else
  {
    document.write( "입력한 숫자는 음수입니다." );
  }
</script>

else if ( 조건식 )은 여러개의 조건식이 계속 중첩될 수 있습니다.