blogger - 삼항 연산자

삼항 연산자는 “?” 와 “:”를 이용한 조건부 연산자로 if / else 와 동일하게 동작합니다. 예를 들어 expr1이 참이면 expr2를 반환하고, 거짓이면 expr3을 반환합니다. 형식은 아래와 같습니다.

(expr1) ? (expr2) : (expr3)

첫 번째에는 조건식이 들어갑니다. 두 번째에는 조건식이 true 일 때 반환되는 값, 세 번째에는 false 일 경우 반환되는 결과 값입니다. 첫 번째 조건식에는 Boolean 형 값만 올 수 있고, 나머지 두 피연산자는 모든 유형이 올 수 있습니다. 예를 들면 다음과 같은 조건식이 됩니다.

boolean ? true : false

아래 예는 게시물에 제목이 없는 경우 "제목없음" 문구로 대체되는 코드입니다.

<h1><b:eval expr='data:title ? data:title : "제목없음"'/></h1>

다음은 모바일로 접속했을 때 배경색상이 빨간색으로 변경되고, 데스크탑으로 접속했을 때는 노랑색으로 변경되는 코드입니다.

<style>
div { width: 100px; height: 100px; }
.mobile { background: red; }
.desktop { background: yellow; }
</style>
<div expr:class='data:view.isMobile ? "mobile" : "desktop"'>
<h1>안녕 하보니!</h1>
</div>