논리 연산자(!, &&, ||)와 단축 평가
논리 연산자와 단축 평가에 대해 알아보자.
논리 연산자?
논리 연산자란 보통 Boolean(참/거짓) 값과 함께 쓰이며, Boolean 값을 반환한다.
만약 Boolean이 아닌 값을 사용하면 boolean이 아닌 값을 반환할 수 있다.
표현식을 평가하는 중에 결과가 확정된 경우 나머지 평가 과정을 생략하는데 이를 단축평가라 한다.
A와 B가 3판 2선승제인 게임을 하는 경우
A가 2번 이겼다면 A가 이긴 것으로 판단 후 이후 남은 게임을 진행하지 않는 것과 같음.
논리 연산자의 연산 방식
논리 연산자의 연산 방식에 대해 자세하게 알아보자.
불리언 값 반환
피연산자의 값이 모두 Boolean 값인 경우, Boolean 값을 반환한다.
!false; //true
!0; // true
!NaN; // true
!undefined; // true
!null; // true
!6; // false
true && true; // true
true && false; //false
false && true; // false
false && false; // false
true || true; // true
true || false; // true
false && true; // true
false && false; // false
(1>3)&&(1<3) // false
(1<3)&&(1<5) // true피연산자 값 반환
피연산자의 값이 Boolean 값이 아닌 경우, 피연산자 값 중 하나를 반환한다.
이때 논리 연산자는 피연산자의 값이 Boolean 값으로 변환하여 판단 후 본래의 값을 반환한다.
var trueValue = 5;
var falseValue = 0;
trueValue && falseValue; // 0
trueValue || falseValue; // 5위의 경우 숫자 0은 false로 판단된다.
&&, ||
&& (and operator)
- 먼저 나열된 피연산자부터 false 값을 찾는다.
- 만약 false 값을 찾는다면 그 즉시 중단 후 false 값인 피연산자를 반환한다.
- 만약 끝까지 false 값을 찾지 못했다면 마지막 피연산자 값을 반환한다.
"hello" && 0 && 6; // 0
true && false && "hello"; // false
true && 6 && "hello"; // "world"|| (or operator)
- 먼저 나열된 피연산자부터 true 값을 찾는다.
- 만약 true 값을 찾는다면 그 즉시 중단 후 true 값인 피연산자를 반환한다.
- 만약 끝까지 true 값을 찾지 못했다면 마지막 피연산자 값을 반환한다.
"hello" || 0 || 6; // "hello"
false || 0 || "hello"; // "hello"
false || 6 || "hello"; // "6"단축 평가 활용 방법
단축 평가를 유용하게 활용할 수 있는 방법을 알아보자.
null, undefined 체크
비어있는 변수의 프로퍼티 값을 참조하려 하면 에러가 발생한다.
이를 예방하기 위해 아래와 같이 단축평가를 사용할 수 있다.
const object = null
const name = object && object.name
console.log(name); // null
const object2 = {
name: 'hong',
}
const name2 = object && object.name
console.log(name); // 'hong'함수 매개변수의 기본값
함수를 호출할 때 필요한 매개변수의 값을 넣지 않은 경우 undefined 값이 넘어오게 된다.
이 값을 그대로 사용하게 되면 에러가 발생할 수 있으므로 단축평가를 이용하여 기본값을 넣어줄 수 있다.
function getAge(age) {
const age = age || 19;
return getAge;
}
console.log(getAge(30)); // 30
console.log(getAge()); // 19에러 체크
함수의 리턴값이 null 혹은 undefined인 경우에도 사용할 수 있다.
function request() {
return undefined; // 넘어온 값이 없다고 가정
}
function getResponse() {
return request(); || '잘못된 요청입니다.'
}
console.log(getResponse()); // '잘못된 요청입니다.'조건문 대체
조건문 대신에 단축 평가를 사용할 수 있다.
const isSuccess = true
let answer = isSuccess && '성공'
console.log(answer) // '성공'위에서 만약 isSuccess 변수에 false에 해당하는 값이 들어갔다면 isSuccess 값이 출력되었을 것이다.
참고
