본문 바로가기
Frontend/JavaScript

조건문 ③ 연산자를 이용한 조건문

by minhi 2024. 9. 14.

JavaScript에서 사용할 수 있는 조건문 중 연산자를 사용한 조건문에 대해 알아보자.

 

조건부 연산자
불 값을 리턴하는 표현식 ? 표현식이 true일 때의 결과 : 표현식이 false일 때의 결과

 

JavaScript에서 3개의 항을 갖는 연산자는 조건부 연산자가 유일해 조건부 연산자를 삼항 연산자라고 부르기도 한다.

 

아래는 조건부 연산자를 사용한 조건문의 예시이다.

<script>
  const number = Number(prompt('숫자를 입력해주세요.'))

  const result = number >= 0 ? '0 이상의 숫자입니다.' : '0보다 작은 숫자입니다.'
  alert(result)
</script>

 

짧은 조건문

 

논리합 연산자를 사용한 짧은 조건문

불 값을 리턴하는 표현식 || 표현식이 false일 때 실행할 문장

 

JavaScript는 표현식의 값이 true가 확실할 경우 추가 연산을 진행하지 않고,

 

논리합 연산자는 두 개의 항 중 하나만 true여도 true를 리턴한다.

 

즉, 논리합 연산자의 좌변이 true면 우변을 실행하지 않고

 

이는 곧 논리합 연산자의 좌변이 false여야 우변을 실행함을 의미한다.

 

JavaScript와 논리합 연산자의 이러한 성질을 이용한 것이 바로 논리합 연산자를 사용한 짧은 조건문이다.

> true || console.log('실행됐습니다.')
true
> false || console.log('실행됐습니다.')
실행됐습니다.
undefined

 

아래는 논리합 연산자를 사용한 짧은 조건문의 예시이다.

<script>
  const number = Number(prompt('숫자를 입력해주세요.'))
  
  const result = number < 0 || '0 이상의 숫자입니다.'
  alert(result)
</script>

 

논리곱 연산자를 사용한 짧은 조건문

불 값을 리턴하는 표현식 && 표현식이 true일 때 실행할 문장

 

Javasript는 표현식의 값이 false가 확실할 경우 추가 연산을 진행하지 않고, 

 

논리곱 연산자는 두 개의 항 모두 true여야 true를 리턴한다.

 

즉, 논리곱 연산자는 좌변이 false면 우변을 실행하지 않고

 

이는 곧 논리곱 연산자의 좌변이 true여야 우변을 실행함을 의미한다.

 

JavaScript와 논리곱 연산자의 이러한 성질을 이용한 것이 바로 논리곱 연산자를 사용한 짧은 조건문이다.

> true && console.log('실행됐습니다.')
실행됐습니다.
undefined
> false && console.log('실행됐습니다.')
false

 

아래는 논리곱 연산자를 사용한 짧은 조건문의 예시이다.

<script>
  const number = Number(prompt('숫자를 입력해주세요.'))
  
  const result = number >= 0 && '0 이상의 숫자입니다.'
  alert(result)
</script>

 

연산자를 이용한 조건문은 조건에 따라 특정 상수 또는 변수의 값이 달라질 경우, 해당 상수 또는 변수에 조건에 맞는 값을 할당할 때 일반적으로 많이 사용된다.

 

 

 

 

 


이 글은 혼자 공부하는 자바스크립트 (윤인성 저)를 바탕으로 공부한 내용을 작성한 글입니다.

'Frontend > JavaScript' 카테고리의 다른 글

반복문 ② 반복문  (1) 2024.09.17
반복문 ① 배열  (1) 2024.09.16
조건문 ② switch 조건문  (0) 2024.09.14
조건문 ① if 조건문  (0) 2024.09.14
입력과 출력  (1) 2024.09.14