07.2. 삼항 조건,논리,쉼표,그룹 연산자
삼항 조건 연산자란
삼항 조건 연산자는 조건식의 평가 결과에 따라 반환할 값을 결정한다. 자바스크립트의 유일한 삼항 연산자이며, 부수 효과는 없습니다.
조건식 ? 조선식이 true일 때, 반환할 값 : 조건식이 false일 때, 반환할 값const result = score >= 60 ? "pass" : "fail";삼항 조건 연산자는 첫 번째 연산자가 true로 평가되면 두 번째 피연산자를 반환하고, 첫 번째 피연산자가 false로 평가되면 세 번쨰 피연산자를 반환한다. 즉, 삼항 조건 연산자는 두 번째 피연산자 또는 세 번째 피연산자로 평가되는 표현식이다.
물음표(?) 앞의 첫 번째 피연산자는 조건식, 즉 불리언 타입의 값으로 평가될 표현식이다. 만약 조건식의 평가 결과가 불리언 값이 아니면 불리언 값으로 암묵적 타입 변환됩니다. 이떄, 조건식이 참이면 콜론(:)앞의 두 번째 피연산자가 평가되어 반환디고, 거짓이면 콜론(:)뒤의 세 번째 피연산자가 평가되어 반환됩니다.
const x = 2;
// 2 % 2 는 0이고 0은 false로 암묵적 타입으로 반환된다.
const result = x % 2 ? "홀수" : "짝수";
console.log(result); // 짝수삼항 조건 연산자의 첫 번째 피연산자는 조건식이므로 삼항 조건 연산자 표현식은 조건문이다.
Key Point💡
if...else문을 삼항 조건 연산자 표현식으로 유연하게 처리할 수 있다. (JSX문법에서 마크업 부분에서 사용)
let x = 2,
result;
// 2 % 2는 0이고, 0은 false로 암묵적 타입 변환한다.
if (x % 2) result = "홀수";
else result = "짝수";
console.log(result);삼항 조건 연산자 표현식은 if...else문과 차이가 있다. 삼항 조건 연산자 표현식은 값처럼 사용할 수 있지만, if...else문은 값처럼 사용할 수 없다.
Key Point💡
if...else문은 표현식이 아닌, 문이다. 따라서 if...else문은 값처럼 사용할 수 없다.
let x = 10
// if...else문은 표현식이 아닌, 문이다. 따라서 값처럼 사용할 수 없다.
var result = if(x%2){result = '홀수'; } else {result='홀수'}
// Uncaught SyntaxError: Unexpected token 'if'Key Point💡
삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문이다.
삼항 조건 연산자 표현식은 값처럼 다른 표현식의 일부가 되어 사용할 수 있다.
var x = 10;
// 삼항 조건 연산자 표현식은 표현식인 문이다. 따라서 값처럼 사용할 수 있다.
var result = x % 2 ? "홀수" : "짝수";
console.log(result); // 짝수Key Point💡
조건에 따라 삼항 조건 연산자 표현식을 사용하는 편이 유리할 수 있지만, 조건이 여러개라면 가독이
if...else가독성이 더 낫다.
논리 연산자
논리 연산자는 우항과 좌항의 피연산자를 논리 연산한다.
\\
논리합(OR)
X
&&
논리곱(AND)
X
!
부정(NOT)
X
// 논리합(||) 연산자
true || true; // true
true || false; // true
false || true; // true
false || false; // false
// 논리곱 연산자(&&)
true && true; // true
true && false; // false
false && true; // false
false && false; // false
// 논리 부정(!) 연산자
!true; // false
!false; // true논리 부정(!) 연산자는 언제나 불리언 값을 반환한다. 단, 피연산자가 반드시 불리언 값일 필요는 없다. 피연산자가 불리언 값이 아니면 불리언 타입으로 암묵적 타입 변환한다.
// 암묵적 타입 변환
!0; // true
!"Hello"; // false논리합(||) 또는 논리곱(&&) 연산자 표현식의 평가 결과는 불리언 값이 아닐 수 도 있다. 논리합(||) 또는 논리곱(&&)연산자 표현식은 언제나 2 개의 피연사자 중 어느 한 쪽으로 평가된다.
// 단축 평가
"Cat" && "Dog"; // Dog쉼표 연산자
쉼표(,)연산자는 왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환한다.
var x, y, z;
(x = 1), (y = 2), (z = 3); // 3 그룹 연산자
소괄호(())로 피연산자를 감싸는 그룹 연산자는 자신의 피연산자인 표현식을 가장 먼저 평가한다. 따라서, 그룹 연산자를 사용하면 연산자의 우선순위를 조정할 수 있다.
10 * 2 + 3; // 23
// 그룹 연산자를 사용하면 우선순위를 조절
10 * (2 + 3); // 50요약
삼항 조건 연산자 표현식은 값처럼 사용할 수 있지만,
if...else문은 값처럼 사용할 수 없다.if...else문은 표현식이 아닌, 문이다. 따라서 값처럼 사용할 수 없다.삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문이다.
논리합(||) 또는 논리곱(&&)연산자 표현식은 언제나 2 개의 피연사자 중 어느 한 쪽으로 평가된다.
그룹 연산자를 사용하면 연산자의 우선순위를 조정할 수 있다.
Last updated