프론트엔드 개발에서 종종 사용되는 기능 중 하나는 읽지 않은 메시지를 표시하는 것입니다. 이를 위해 자바스크립트에서 Ternary 연산자를 활용하여 간단하게 구현할 수 있습니다. Ternary 연산자는 조건문을 간결하게 표현할 수 있는 방법으로, 다음과 같은 형식을 가지고 있습니다.

(condition) ? (expression1) : (expression2)

이때, condition은 참과 거짓을 판단하는 조건식이고, expression1은 참일 경우 실행되는 표현식입니다. expression2는 거짓일 경우 실행되는 표현식입니다.

이제 이를 읽지 않은 메시지 표시에 적용해보겠습니다. 예를 들어, 읽지 않은 메시지가 있을 경우 “메시지가 있습니다.”라는 문구를, 읽지 않은 메시지가 없을 경우 “메시지가 없습니다.”라는 문구를 표시하고 싶다면 다음과 같이 구현할 수 있습니다.

var unreadMessages = 3;
var message = (unreadMessages > 0) ? "메시지가 있습니다." : "메시지가 없습니다.";
console.log(message);

위의 예제에서 unreadMessages 변수는 읽지 않은 메시지의 개수를 나타내고, Ternary 연산자를 사용하여 message 변수에 적절한 문구를 할당합니다. 만약 읽지 않은 메시지의 개수가 0보다 크면 “메시지가 있습니다.”가 출력되고, 그렇지 않으면 “메시지가 없습니다.”가 출력됩니다.

이렇게 Ternary 연산자를 사용하면 간단하고 직관적인 방식으로 읽지 않은 메시지를 표시할 수 있습니다. 프론트엔드 개발에서 상태에 따라 다른 메시지를 표시해야 할 때 유용하게 사용될 수 있습니다.

참고 자료:

• MDN web docs: Conditional (ternary) operator

#javascript #frontend