본문 바로가기
TIL/Javascript

/JavaScript/조건문 형식

by code_Cook 2021. 12. 23.
조건문

 

boolean과 비교 연산자를 통해 상황에 알맞은 

코드를 실행할 수 있게 한다.

 

형식

 

저번 학습에서 배웠던 boolean과 비교 연산자를 응용하는 방법을 알아봤다.

간단한 예제를 통해 알아보자!

<script>
  document.write("1<br>");
  document.write("2<br>");
  document.write("3<br>");
  document.write("4<br>");
</script>

위와 같이 코드를 작성하게 되면 웹페이지에서는 숫자 옆의 <br> 태그에 따라

줄 바꿈 되어 순서대로 세로로 나열될 것이다.

if문(조건식)

 

여기서 저 나열된 숫자들을 어떠한 조건에 맞춰졌을 때 출력이 안되게 만들어 보았다.

그때 사용되는 게 if문과 boolean을 사용하는 것이다.

<script>
  document.write("1<br>");
  if(true) {
  document.write("2<br>");
  } else {
  document.write("3<br>");
  }
  document.write("4<br>");
</script>

 

위처럼 작성하게 되면 웹페이지에서는 다음과 같은 결과를 출력해준다.

if문의 ( ) 안에 true라는 boolean 값에 의해 위와 같은 결과가 나온 것이다.

그럼 ( ) 안에 false값이 들어갔을 때 어떤 결과가 나올까.

이처럼 다른 결과가 출력되는 걸 알 수 있다.

간단한 예제여서 차이점을 쉽게 찾을 수 있을 것이다. if 문 ( ) 안에 boolean 값을 통해

각각 다른 코드가 실행된다는 것이다. 

 

'true'일 경우 먼저 1번 코드를 실행하고 조건식으로 들어와 2번 코드를 출력하고

else문 안에 있는 코드는 조건에 맞지 않아 건너뛰고 4번 코드를 출력해준다. 즉 true 값이 들어온다면

else문의 코드는 실행이 되지 않는다.

 

'false' 조건일 때엔 어떨까. 마찬가지로 1번 코드가 실행되고 조건식이 false 값이라 포함하고 있는 2번 코드는

실행되지 않고 else문으로 넘어가 3번 코드를 실행하고 4번 코드를 실행하게 된다.

 

이처럼 아주 간단한 예제를 통해 boolean값을 if(조건식)에 적용하여 사용해 보았다.

지금은 true와 false를 if( ) 안에 대입해서 고정적인 값을 준거지만 if( ) 안에 비교 연산자를 이용하여

상황에 따라 알맞은 코드가 실행될 수 있게 한다는 것에 매우 흥미로웠고 유익한 시간이었다. 

'TIL > Javascript' 카테고리의 다른 글

/JavaScript/리팩토링  (0) 2021.12.25
/JavaScript/조건문 활용  (0) 2021.12.24
/JavaScript/비교 연산자,boolean  (0) 2021.12.22
/JavaScript/태그 제어  (0) 2021.12.21
/JavaScript/CSS활용  (0) 2021.12.20