[JavaScript] 기초: 자바스크립트 기초 삼항 연산자란?

삼항 연산자란?

<script>
        // 삼항 연산자 (조건식) ? true : false

        var x = 100;
        var y = 10; 

        var z = x > y ? "x가 y보다 더 크다" : "X가 y보다 더 작다";
        alert(z);
        
    </script>

 

삼항 연산자는 자바스크립트에서 조건문을 간단하게 표현할 수 있는 연산자입니다. 이름에서 알 수 있듯이 세 개의 피연산자를 사용합니다. 기본 형태는 다음과 같습니다:

javascript코드 복사
조건 ? 참일 때의 값 : 거짓일 때의 값

기본 예제

javascript코드 복사
var result = (5 > 3) ? "참" : "거짓";
console.log(result); // "참"

• 5 > 3이라는 조건이 참이기 때문에 result는 "참"이 됩니다.
• 만약 조건이 거짓이라면 result는 "거짓"이 됩니다.

삼항 연산자 사용 예제

기본 if-else 문

javascript코드 복사
var nCount = 0;
var sText = "test";

if (sText == "test") {
    nCount += 1;
} else {
    nCount -= 1;
}
alert(nCount); // 1

• 변수 nCount를 0으로 초기화하고, sText를 "test"로 초기화합니다.
• if 문에서 sText가 "test"와 같으면 nCount를 1 증가시키고, 그렇지 않으면 1 감소시킵니다.
• nCount를 경고창으로 표시합니다. 이 경우 sText가 "test"이므로 nCount는 1이 됩니다.

삼항 연산자를 사용한 간단한 표현

javascript코드 복사
nCount = (sText == "test") ? nCount + 1 : nCount - 1;
alert(nCount); // 1

• 삼항 연산자를 사용하여 동일한 로직을 더 간단하게 표현할 수 있습니다.
• (sText == "test") 조건이 참이면 nCount를 1 증가시키고, 거짓이면 1 감소시킵니다.
• 이 경우에도 sText가 "test"이므로 nCount는 1이 됩니다.

정리

• 기본 if-else 문: 조건에 따라 코드 블록을 실행하는 기본적인 방법입니다.
• 삼항 연산자: 간단한 조건문을 한 줄로 작성할 수 있는 방법입니다. (조건) ? 참일 때 값 : 거짓일 때 값 형태로 사용합니다.

이 두 방법은 같은 결과를 만들지만, 삼항 연산자는 코드를 더 간결하게 만들 수 있습니다.

최종 정리 예제 코드

javascript코드 복사
var nCount = 0;
var sText = "test";

// 기본 if-else 문
if (sText == "test") {
    nCount += 1;
} else {
    nCount -= 1;
}
alert(nCount); // 1

// 삼항 연산자를 사용한 표현
nCount = (sText == "test") ? nCount + 1 : nCount - 1;
alert(nCount); // 1

이 코드는 sText가 "test"일 때 nCount를 1 증가시키고, 그렇지 않으면 1 감소시킵니다. 두 경우 모두 nCount는 1이 됩니다.