제로초 JAVASCRIPT 2-15 조건부 연산자(삼항 연산자)

Yumin Jung·2023년 7월 21일
0

제로초의 JAVASCRIPT

목록 보기
18/18

조건식 ? 참일 때 실행되는 식 : 거짓일 때 실행되는 식

위의 식을 '조건부 연산자' 또는 '삼항연산자'라고 한다.

if문과 switch문 등 처럼 문이 아니라 식이다. 그러므로 결과값이 나온다.

5 > 0 ? '참입니다' : '거짓입니다';
결과 : "참입니다"

이렇게 결과값을 돌려주는게 중요한데,
let value = 5 < 0 ? '참입니다' : '거짓입니다':
이렇게 식을 대입할 수 있다. 결과값을 value에 넣을 수 있다는 것이다.

 let condition = true;
 if (condition) {
    value = '참';
  } else {
    value = '거짓';
  }
  console.log(value);

실제로 이렇게 if문이 펼쳐진 것을

  let condition = true;
  let value = condition ? '참' : '거짓';
  console.log(value);

이렇게 짧게 줄일 수 있다는 장점이 있다.
그래서 선호도가 높다.
하지만 협업에서는 남이 쓴 코드를 많이 보기 때문에 가독성의 부분에서 떨어질수도 있다. 물론, 비추하는 건 아니다. 때에 맞춰서 사용해야겠다.

결론은, 다 알아야한다는 것이다.

그리고 조건부 연산도 중첩해서 사용할 수 있다.

let value = condition1 ? (condition2 ? '둘 다 참' : 'condition1만 참') 
: 'condition1이 거짓';

이렇게 소괄호 연산자로 감싸줘서 가독성이 떨어지는 것을 막아야 한다. 또는, 아래와 같이 들여쓰기로 구분할 수 있다.

let value = condition1
  ? condition2
    ? '둘 다 참'
    : 'condition1만 참'
  : 'condition1이 거짓';

퀴즈

let cond = true
let value = '';
if (cond) {
  value = '참';
} else {
  value = '거짓';
}
  1. switch문으로 바꿔보자
  1. 삼항 연산자로 바꿔보자

삼항 연산자는 식이므로 결과값을 value에 넣었다.

profile
문과를 정말로 존중해

1개의 댓글

comment-user-thumbnail
2023년 7월 21일

잘 읽었습니다. 이런 복잡한 개념을 쉽게 설명해주셔서 감사합니다. 삼항 연산자의 사용법과 이점에 대해 명확하게 이해할 수 있게 되었습니다. 계속해서 유익한 글 부탁드립니다.

답글 달기