JavaScript 삼항 연산자 축약 및 예시

JavaScript 삼항 연산자란?

JavaScript에는 if-else 조건문 대신 간단한 조건식을 평가하여 값을 리턴하는 삼항 연산자가 있습니다. 삼항 연산자는 조건식을 평가한 결과에 따라 두 개의 식 중 하나를 선택하여 리턴합니다. 삼항 연산자는 보다 간결하고 가독성이 높은 코드를 작성하는 데 도움이 됩니다.

삼항 연산자의 구조

삼항 연산자는 다음과 같은 구조를 가지고 있습니다.

조건식 ? 참일 때 리턴값 : 거짓일 때 리턴값

조건식은 평가되어 true 또는 false를 리턴하는 표현식이고, 참일 때 리턴값은 조건식이 true일 때 리턴되는 값입니다. 거짓일 때 리턴값은 조건식이 false일 때 리턴되는 값입니다.

삼항 연산자의 축약

JavaScript에서는 삼항 연산자를 축약하여 사용할 수 있습니다. 축약된 삼항 연산자는 보다 간결한 코드를 작성하는 데 도움이 됩니다. 여러 예시를 통해 살펴보겠습니다.

1. 숫자 비교하기

const result = (x > y) ? "x가 y보다 큽니다." : "y가 x보다 큽니다.";

위의 예시에서는 x와 y의 값을 비교하여, x가 y보다 크면 "x가 y보다 큽니다."를, 그렇지 않으면 "y가 x보다 큽니다."를 리턴합니다.

2. 빈 문자열 확인하기

const message = (str === "") ? "문자열이 비어있습니다." : "문자열이 비어있지 않습니다.";

위의 예시에서는 str이 빈 문자열인 경우에는 "문자열이 비어있습니다."를, 그렇지 않은 경우에는 "문자열이 비어있지 않습니다."를 리턴합니다.

3. 조건에 따른 함수 실행

(user.isAdmin === true) ? grantAdminAccess() : denyAccess();

위의 예시에서는 user의 isAdmin 속성이 true인 경우에는 grantAdminAccess() 함수를 호출하고, 그렇지 않은 경우에는 denyAccess() 함수를 호출합니다.

4. 값에 따른 스타일 지정하기

const color = (isDarkMode) ? "black" : "white";
const backgroundColor = (isDarkMode) ? "white" : "black";

위의 예시에서는 isDarkMode 값이 true인 경우에는 color를 "black", backgroundColor를 "white"로 지정하고, 그렇지 않은 경우에는 color를 "white", backgroundColor를 "black"로 지정합니다. 이를 통해 다크 모드와 라이트 모드에 따라 스타일을 지정할 수 있습니다.

코드 가독성과 주의사항

삼항 연산자는 간결한 코드 작성에 도움이 되지만, 지나치게 복잡하거나 중첩될 경우 가독성이 떨어질 수 있습니다. 가독성을 높이기 위해 적절한 들여쓰기와 괄호 사용을 고려해야 합니다.

또한, 삼항 연산자는 단순한 조건식에만 사용하는 것이 좋습니다. 복잡한 로직이 필요한 경우에는 if-else 문을 사용하는 것이 더 명확하고 이해하기 쉬울 수 있습니다.

이상으로 JavaScript 삼항 연산자 축약 및 예시에 대해 알아보았습니다. 삼항 연산자는 조건에 따라 값을 리턴하기 위해 많이 사용되며, 코드 작성을 간결하게 만들 수 있는 강력한 도구입니다. 적절하게 활용하여 보다 명확하고 가독성이 높은 코드를 작성해보세요!