[JS] 삼항연산자

 

삼항연산자의 기본적인 사용방법

 

삼항연산자를 만들기 앞서 

간단하게 조건식을 만들어보자.

    let a = 3;
    if (a >= 0) {
      console.log('양수')
    } else {
      console.log('음수')
    }

a가 0보다 크거나 같으면 양수, 아니면 음수!

이렇게 적어줘도 되지만 더 간단하게 표현 할 수 있는 방법이있다.

 

    let a = 3;
    a >= 0 ? console.log('양수') : console.log('음수');

a가 0보다 크면 양수, 아니면 음수를 출력해라. 라는 뜻이다.

이렇게 삼항연산자는 조건문을 파격적으로 줄여줄수있는 태크닉이다.

 

우선, 조건식을 적어주고 물음표 키워드를 사용한다.

그 다음엔 참일때 ,실행한 식을 적고, 거짓일때 실행할 식은 : 콜론을 찍고 적어주면 된다.

 

  let arr = [];

    if (arr.length === 0) {
      console.log("빈배열")
    } else {
      console.log("빈배열아님")
    }

위의 코드를 삼항연산자로 바꿔보자.

let arr = [];
  arr.length === 0 ? console.log('빈배열') : console.log('빈배열아님')

 

이번에는 값을 참일때와 거짓일때를 구분해서 반환해보자.

삼항연산자가 리턴할 값이 있어야하니까 값을 적어주고,

arrayStatus 상수에 대입해서 출력하면 정상적으로 작동된다. 

 let a = [];

const arrayStatus = a.length === 0 ? "빈배열" : "안빈배열";
console.log(arrayStatus); //빈배열

 

 

삼항연산자 스마트하게 활용 방법

삼항연산자로 조건식을 사용하기때문에 truthy와 falsy를 사용할 수 있다.

(truthy와 falsy가 기억이안나면 이전 포스팅을 보고 와주세요.)

https://seo0yoon.tistory.com/12?category=955107

[JS] Truthy & Falsy 형 변환 (Type conversion)

 

주어진값이 null, undefined이 아닌지를 판단하는 프로그램을 만들어보면.

 

   let a;
    
    const result = a ? true : false;
    console.log(result) //false

여기서 a란 값은 undefined이기때문에 falsy다.

result 상수에는 falsy가 할당된다.

 

  let a = [];

    const result = a ? true : false;
    console.log(result) //true

반대로 a의 값을 truthy한 값인 배열로 바꾸면?

true가 출력된다.

 

 

삼항연산자를 중첩해서 사용하는 방법

이번에는 학점을 계산하는 프로그램을 만들어보자.

90점 이상 A+

50점 이상 B+

둘다 아니면 F

let score = 100;

score >= 90 
? console.log("A+") 
: score >= 50 
? console.log("B+") 
: console.log("F")

 

 

스코어가 90을 넘으면 a+를 출력하고, 그렇지않으면 (한번 더 비교를 해줌)

스코어가 50을 넘으면 b+을 출력해준다. 

둘다 아니면 f를 출력시킨다.

 

 

삼항연산자를 사용하면 긴코드를 간략하게 줄일 수 있다.
하지만 중첩 삼항연산자를 사용하면 가독성이 떨어지기때문에
삼항연산자를 중첩으로 사용하면 if조건문을 사용하는게 더 낫다.