코딩 공부/JAVASCRIPT

조건문에 대해서 알아보자

천서리 2023. 2. 24. 17:29
QUOTE THE DAY

“ 당신이 6개월 이상 한 번도 보지 않은 코드는 다른 사람이 다시 만드는 게 훨씬 더 나을 수 있다. ”

- 이글슨 (Eagleson)
반응형

조건문

 

자바스크립트 if 조건문은 조건식이 참일 경우 코드가 실행됩니다.

if else 조건문은 조건식이 참/거짓일 경우 각각 실행 코드를 지정할 수 있습니다.

if else if 조건문은 두 개 이상의 조건식을 설정할 수 있습니다.

 

 

 

 

01. if 문

조건문 중 가장 유명하고 대표적인 조건문은 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 구문을 삽입하면 거짓일 경우에 실행될 코드를 지정 할 수 있습니다.

 

 

 

 

02. if - else 문

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

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

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

 

 

 

03. 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 ( 조건식 )은 여러개의 조건식이 계속 중첩될 수 있습니다.

 

 

 

 

04. 삼항 조건문

자바스크립트 삼항 연산자는 참/거짓에 따라 선택적으로 실행되는 조건문입니다.

삼항연산자는 조건문 ? 선택문1 : 선택문2 으로 구성됩니다.

조건문이 참이면 선택문1을 실행하고, 조건문이 거짓이면 선택문 2를 실행합니다.

 

3항 연산자의 구성

자바스크립트 삼항연산자 기능은 세 개의 항으로 연산을 처리합니다. 세 개의 항은 각각 조건문 하나와 선택문 두 개로 구성됩니다.

3항 연산자는 조건문이 true일 때 선택문1을 실행합니다. 조건문이 false일 때 선택문2를 실행합니다.

클릭시 이미지 출처로 이동합니다.

조건문과 선택문을 구분하는 기호는 물음표 ? 를 사용합니다. 선택문1과 선택문2를 구분하는 기호는 콜론 : 을 사용합니다.

조건문 ? 선택문1 : 선택문2

세 개의 항 중 하나에 조건문이 들어가기 때문에 정확한 명칭은 조건부 삼항 연산자(Conditional Ternary Operator) 정도가 되겠습니다.

삼항연산자는 if 구문과 기능이 비슷합니다. if 조건문의 경우 몇 줄로 코드를 작성해야 하지만, 삼항연산자는 한 줄로 끝낼 수 있습니다.

 

 

 

 

05. swich 문

if…else 문의 조건식이 반드시 불리언 값으로 평가되는 반면,
switch 문의 표현식은 불리언 값보다는 문자열, 숫자 값인 경우가 많다.
if…else 문은 논리적 참, 거짓으로 실행할 코드 블록을 결정한다.
하지만 switch 문은 논리적 참, 거짓보다는 다양한 상황(case)에 따라 실행할 코드 블록을 결정할 때 사용한다.

 

 

 

 

기본 문법 (Syntax)

switch문의 기본 문법 구조는 다음과 같다.

switch 문은 switch 문의 condition을 평가하여 그 값과 일치하는 표현식을 갖는 case 문으로 실행 순서를 이동시킨다.

switch (condition) {
  case value1:
    statement1;
    break;
  case value2:
    statement2;
    break;
  ...
  default:
    statement3;
}

condition의 값이 value1이면 statement1을, value2면 statement2를, 그 어느 것도 아니라면 default가 적용되어 statement3을 실행한다.

조건이 맞아 break를 만나면 그 이후의 비교는 하지 않으며, switch문을 종료시킨다.

default문은 switch문의 가장 마지막에 위치하므로 default 문의 실행이 종료하면 switch 문을 빠져나간다. 따라서 break를 생략하는 것이 일반적이다.

반응형
Adventure Time - BMO