단축 평가 논리 계산법은 논리 연산자를 이용해서 코드를 좀 더 단축해서 쓰는 것을 의미한다.
true && true // true
true && false // false
true || false // true
false || true // true논리 연산자를 사용할 때 무조건 우리가 true 혹은 false 값을 사용하는 것은 아니다.
문자열이나 숫자, 객체를 사용할 수도 있고, 해당 값이 Truthy 하냐 Falsy 하냐에 따라 결과가 달라진다.
만약 함수에서 animal 값이 제대로 주어졌을 때만 name 을 조회하고, 그렇지 않을 때는 그냥 undefined 를 반환하게 하고 싶으면 어떻게 해야할까?
const dog = {
name: '멍멍이'
};
function getName(animal) {
if (animal) {
return animal.name;
}
return undefined;
}
const name = getName();
console.log(name);이렇게 하면 animal 값이 주어지지 않아도 에러가 발생하지 않게 된다.
이러한 코드를 논리 연산자로 사용하면 코드를 단축시킬 수 있다.
&& 연산자
&& 연산자는 특정 값이 유효할 때에만 어떤 값을 조회하는 작업을 해야할 때 매우 유용하다.
A 가 Truthy한 값이라면 B 가 결과값이 된다.
반면 A 가 Falsy한 값이라면 결과는 A 가 된다.
&& 를 사용하면 첫번째로 나오는 false 값을 반환하며, 둘 다 true 라면 마지막 값을 반환한다.
A(true) && B() // B 반환
A(false) && B() // A 반환이해하기
&& 연산자는 두 조건이 모두 참이어야 성립된다.
때문에 A가 true 일 때 B 도 true 가 되어야 성립되기 때문에 B 가 반환이 된다.
반대로 A가 false 일 때는 두 조건이 모두 참이되지 못하기 때문에 그대로 A 를 반환하는 것이다.
const dog = {
name: '멍멍이'
};
function getName(animal) {
return animal && animal.name;
}
const name = getName(dog);
console.log(name); // 멍멍이이게 작동하는 이유는 A && B 연산자를 사용하게 될 때 A 가 Truthy한 값이라면 B 가 결과값이 되기 때문이다.
반면 A 가 Falsy 한 값이라면 결과는 A 가 된다.
console.log(true && 'hello'); // hello
console.log(false && 'hello'); // false
console.log('hello' && 'bye'); // bye
console.log(null && 'hello'); // null
console.log(undefined && 'hello'); // undefined
console.log('' && 'hello'); // ''
console.log(0 && 'hello'); // 0
console.log(1 && 'hello'); // hello
console.log(1 && 1); // 1이러한 속성을 잘 알아주면, 특정 값이 유효할 때에만 어떤 값을 조회하는 작업을 해야 할 때 매우 유용하다.
|| 연산자
A 가 Truthy할 경우 결과는 A 가 된다.
반면, A 가 Falsy 하다면 결과는 B 가 된다.
A(true) || B() // A 반환
A(false) || B() // B 반환이해하기
|| 연산자는 두 개의 조건 중 하나가 참이면 식이 성립된다.
따라서 A가 true 일 때 성립되므로 A 가 반환되고,
반대로 A가 false 일 때는 나머지 하나가 참이어야 성립되므로 B 가 반환된다.
예시
const namelessDog = {
name: ''
};
function getName(animal) {
const name = animal && animal.name;
if (!name) {
return '이름이 없는 동물입니다';
}
return name;
}
const name = getName(namelessDog);
console.log(name); // 이름이 없는 동물입니다.단축형
const namelessDog = {
name: ''
};
function getName(animal) {
const name = animal && animal.name;
return name || '이름이 없는 동물입니다.';
}
const name = getName(namelessDog);
console.log(name); // 이름이 없는 동물입니다.A || B 는 만약 A 가 Truthy할 경우 결과는 A 가 된다.
반면, A 가 Falsy 하다면 결과는 B 가 된다.
이러한 단축 평가 논리법을 이용해서 삼항 연산자과 비슷하게 입력받은 값의 Falsy 함에 따라서 원하는 값을 출력할 수 있도록 사용할 수 있을 것 같다.