[JavaScript] 삼항연산자 사용방법 (조건문)

2023. 9. 5. 22:53JavaScript

 

우리가 가장 많이 사용하는 조건문은 if문이다.

하지만 if문 외에 간단히 조건문을 사용할 수 있는 것이 바로 삼항연산자이다.

 

예제를 통해서 if문을 삼항연산자로 바꾸어봤을 때의 장점을 살펴보자.

 

name 이라는 변수에 빈 배열을 선언을 해주고,

선언한 name의 배열 길이가 0일 경우와 아닐 경우를 조건으로 예시를 들어보겠다.

 

if 조건문

let name = [];

if (name.length === 0) {
	console.log("배열 안에 데이터가 없습니다.")
} else {
	console.log("배열 안에 데이터가 있습니다.")
}


// 배열 안에 데이터가 없습니다.

삼항연산자

let name = [];

name.length === 0 ? console.log("배열안에 데이터가 없습니다.") : console.log("배열안에 데이터가 있습니다.")

//  배열안에 데이터가 없습니다.

 

보이는 바와 같이 if문을 사용했을 때와 달리

삼항연산자를 사용하면 코드를 한 줄로 간단하게 조건문을 사용할 수 있다.

 

삼항연산자의 사용문법은

조건 ? true : false 이다.

 

그리고 만약에 console.log()를 사용하지 않고 문자열을 리턴하고 싶을 때는
아래와 같이 리턴받을 변수를 선언해주면 된다.

let name = [];

const data = name.length === 0 ? "배열안에 데이터가 없습니다." : "배열안에 데이터가 있습니다."

console.log("data : " + data);  

// data : 배열안에 데이터가 없습니다.

 


 

중첩 삼항연산자

let age = 19;

age >= 20 ? console.log("성인") : age >= 17 ? console.log("고등학생") : console.log("중학생")

// 고등학생

삼항연산자도 중첩해서 삼항연산자 안에 또 삼항연산자를 사용할 수 있다.

하지만 중첩 삼항연산자의 경우 단점은

아무래도 가독성이 떨어진다는 점이다.

 

이해를 위해 중첩 삼항연산자를 if 조건문으로 바꾸어 보겠다.

 

if 조건문

let age = 19;

if (age >= 20) {
	console.log("성인")
} else if (age >= 17) {
	console.log("고등학생")
} else {
	console.log("중학생")
}


// 고등학생

이렇게 중첩 삼항연산자를 사용할 상황에는

if 조건문을 사용하는 것이 가독성을 높일 수 있어서

이 경우엔 if 조건문을 사용하는 것을 추천한다.