[JS] 14. 응용: Truthy & Falsy / 삼항 연산자 / 단락 회로 평가
1) Truthy & Falsy
Truthy는 참은 아니지만 참 값은 값, Falsy는 거짓은 아니지만 거짓 같은 값입니다.
자바스크립트의 조건식에는 boolean형 값 외에도 자바스크립트만의 특정 기준으로 인자를 참이나 거짓으로 분류하는 속성이 있습니다. 여기에서 나오는 개념이 Truthy와 Falsy입니다. Boolean 타입의 true가 아니어도 true로 분류되는 값들을 Truthy, 반대로 false가 아니어도 false로 분류되는 값들을 Falthy라고 부릅니다.
[Flathy 값]
null
undefined
0, -0
NaN
"" / '' / `` (빈 문자열)
flase
falty로 정의된 값들을 제외한 나머지 값들은 모두 truty 값으로 분류됩니다.
[활용 예시]
const getName = (person) => {
return person.name; // *오류 발생
}; // 객체를 매개변수로 받아, 받은 객체에서 특정 프로퍼티를 반환하는 함수
let person; //정의되지 않은 객체
const name = getName(person);
console.log(name);
예시 코드에서 person은 정의되지 않은 객체이기 때문에 내부 프로퍼티에 접근할 수가 없어 오류가 발생합니다. (undefined / null값은 객체가 아닙니다.)
이런 상황에서 오류가 발생하지 않게 하기 위해 전달 받은 매개변수가 undefined /null인지 아닌지를 검사하는 예외처리 코드를 추가해보겠습니다.
const getName = (person) => {
if (person === undefined || person === null) {
return "*객체가 아닙니다.";
}
return person.name;
}; // 객체를 매개변수로 받아, 받은 객체에서 특정 프로퍼티를 반환하는 함수
let person; //정의되지 않은 객체
const name = getName(person);
console.log(name); //'*객체가 아닙니다.' 출력
오류는 해결되었지만 매번 이런 식으로 조건문을 추가하는 것은 상당히 번거로울 것 같습니다.
falthy 속성을 이용하여 더 쉽게 해결이 가능합니다.
const getName = (person) => {
if (!person) { // flase NOT => true
return "*객체가 아닙니다.";
}
return person.name;
}; // 객체를 매개변수로 받아, 받은 객체에서 특정 프로퍼티를 반환하는 함수
let person; //정의되지 않은 객체
const name = getName(person);
console.log(name); //*객체가 아닙니다.
2) 삼항 연산자
삼항 연산자는 조건문을 한 줄로 아주 짧게 줄여 쓸 수 있도록 합니다.
[문법]
조건식 ? 참일 때 수행할 명령 : 거짓일 때 수행할 명령
[예시 코드]
위에서 다룬 truthy / falsy 개념을 이용한 예시 코드입니다.
let a = [];
const result = a ? true : false;
console.log(result); //true 출력
삼항 연산자를 중첩해서 이용한 예시 코드입니다.
/* 학점 계산 프로그램 */
let score = 40;
score >= 90
? console.log("A")
: score >= 50
? console.log("B")
: console.log("C");
//C를 출력
* 삼항 연산자를 중첩 구조로 작성할 수는 있지만 가독성이 떨어지기 때문에 가급적이면 중첩 if문을 사용합니다.
3) 단락회로 평가
단락회로 평가는 왼쪽에서 오른쪽으로 연산을 수행하는 논리 연산자의 연산 순서 특성을 이용한 문법입니다.
단락회로 평가: 논리 연산의 피연산자 중 뒤에 오는 피연산자를 확인할 필요 없이 연산을 끝내는 것.
예를 들어, 'false && true' 연산과 'true || false' 연산은 뒤에 오는 피연산자 값과 상관없이 각각 false와 true라는 연산 결과가 나옵니다.
let person = { name: "별안간 공대생" }; //정의되지 않음 (undefined)
const getName = (person) => {
const name = person && person.name; //truthy && truthy -> person.name의 값("별안간 공대생")이 반환
return name || "객체가 아닙니다."; //name이 truthy하기 때문에 뒤에 오는 값과 상관없이 name의 값을 반환
};
const name = getName(person);
console.log(name); //'별안간 공대생' 출력