[JavaScript]조건문과 조건부 연산자(if, ?)

조건 처리를 위해 필요한 조건문과 조건부 연산자.
이번 단원에서는 if문과 물음표 연산자로도 불리는 조건부 연산자 ?에 대해 배웠다.

1. ‘if’문

1-1. 기본

• 기본 형태 : if (…){…}
  • 괄호 속 조건을 평가해서 결과가 true면 코드 블록 실행
• 조건 참일 때 실행할 구문이 한 줄이더라도 가독성을 위해 중괄호 사용을 추천한다.
  
  

1-2. Boolean형으로 변환

if문에서 조건 평가할 때 어떤 것들이 true이고 false일까?

true로 평가되는 값들은 ‘truthy(참 같은)’ 값, false로 평가되는 값들은 ‘falsy(거짓 같은)’ 값이라고 한다.

• falsy : 숫자 0, 빈 문자열(""), null, undefined, NaN
• truthy : falsy가 아닌 값들

⬇️ 평가를 통한 Boolean 값을 if문에 전달하는 것도 가능하다.

let cond = (year == 2015); // 동등 비교로 true/false 여부 결정
if (cond) {
...
}

1-3. else, else if

if의 조건이 거짓일 때 사용 가능한 else,

여러 조건을 처리할 때 사용 가능한 else if.

else if문에서는 맨 위에서부터(if부터) 조건을 차례로 평가하면서 해당하는 부분의 구문을 실행한다.

*else if 문 마지막 else는 필수가 아닌 선택

2. 조건부(conditional) 연산자 ‘?’/삼항(ternary) 연산자

• 조건에 따라 다른 값을 변수에 할당해주고 싶을 때 조건문보다 짧게 표현 가능하다.
• 피연산자가 3개이다. JS에서 피연산자 3개나 받는 연산자는 조건부 연산자가 유일하다.

2-1. 기본

• 기본 형태: let result = condition ? value1 : value2;
  • 평가 대상(condition)이 참이면 value1, 거짓이면 value2 반환
  • 코드 가독성을 위해 조건 부분(condition)에 괄호 사용을 추천한다.(조건부 연산자는 우선순위가 낮기 때문에 괄호가 없어도 상관 없긴 하다.)

2-2. 다중 ‘?’

?를 여러 개 연결하면 복수 조건 처리가 가능하다.

⬇️ 예시

let age = prompt('나이를 입력해주세요.', 18);

let message = (age < 3) ? '아기야 안녕?' :
  (age < 18) ? '안녕!' :
  (age < 100) ? '환영합니다!' :
  '나이가 아주 많으시거나, 나이가 아닌 값을 입력 하셨군요!';

alert( message );

• age < 3 먼저 평가하고 거짓이면 age < 18 평가하고 거짓이면 age < 100을 평가하는 그런 구조!

2-3. 부적절한 ‘?’

가독성을 위해 ?를 if 대용으로 쓰지 않는 것이 좋다.

물음표 연산자는 조건에 따라 반환 값을 다르게 하려는 목적! 목적에 맞게 사용하자. 평가 결과를 변수에 할당할 때 사용한다고 생각하면 편하다.

여러 분기 처리 할 때는 if를 쓰자.

⬇️ 예를 들어 아래와 같은 경우는 부적절한 경우(평가 결과에 따라 실행되는 표현식이 달라지는 상황)

let company = prompt('자바스크립트는 어떤 회사가 만들었을까요?', '');

(company == 'Netscape') ?
   alert('정답입니다!') : alert('오답입니다!');