천진난만 코딩 스토리

2. JavaScript 응용 - Truthy & Falsy, 삼항연산자, 단락회로 평가 본문

인프런/한입 크기로 잘라 먹는 리액트

2. JavaScript 응용 - Truthy & Falsy, 삼항연산자, 단락회로 평가

Wisdom_1104 2023. 2. 5. 23:51

1 ) Truthy & Falsy

let a = "string";
let b = Infinity;
let c = "0";
let d = 13;
let e = []; 

trueCheck(a);
trueCheck(b);
trueCheck(c);
trueCheck(d);
trueCheck(e);


//결과
TRUE

비어있지 않은 값과 0을 제외한 숫자는 True.

 

 

let a = undefined;
let b = "";
let c = 0;
let d = null;
let e = NaN;
 
trueCheck(a);
trueCheck(b);
trueCheck(c);
trueCheck(d);
trueCheck(e);


//결과
FALSE

비어있는 값이거나 0인 값은 Flase.

 

 

 

2 ) Falsy 연산자 응용

const getName = (person) => {
	if (!person) {
		return "객체가 아닙니다.";
	}
	return person.name;
};
 
let person;
const name = getName(person);
console.log(name);



//결과
객체가 아닙니다.

falsy 연산자인 ' ! '을 사용하여

false NOT=> True 라는 거을 활용함.

person가 undefined이기 때문에  "객체가 아닙니다."를 출력.

 

const getName = (person) => {
	if (!person) {
		return "객체가 아닙니다.";
	}
	return person.name;
};
 
let person = {name: "Olaf"};
const name = getName(person);
console.log(name);



//결과
Olaf

let person = {name: "Olaf"}; 를 하면

person이 undefined 나 unll이 아니기에 Olaf 를 출력.

 

 

 

3 ) 삼항 연산자

const a = 5;
let text = '';
if (a < 10) {
  text = '크다';
} else {
  text = '작다';
}
console.log(text);


// 출력
작다

if 조건문으로 작성하면 코드가 길어짐.

이 코드를 삼항 연산자를 사용하면 짧게 줄일 수 있음.

 

 

const a = 5;
let text = a < 10 ? '크다' : '작다';

console.log(text);


// 출력
작다

let text = a < 10 ? '크다' : '작다';

text라는 변수인 a가 10보다 작으면 '크다'를 아니라면 '작다'를 말함.

조건 ? 참일 경우 : 거짓일 경우 ;의 순서대로 작성하면 됨.

 

 

 

4 ) 단락회로 평가

const getName = (person) => {
const name = person && person.name;
return name || "객체가 아닙니다.";
};

let person = { name: "Olaf" };
const name = getName(person);
console.log(name);


//결과
Olaf

&&는 and 연산자이므로 두 개 모두 참이어야 참이고,

||는 or 연산자이므로 둘 중 하나만 참이어도 참임.

 

그렇기에

const name = person && person.name; 에서

person의 값이 Olaf가 되고,

return name || "객체가 아닙니다."; 에서

name에 person.name인 Olaf가 저장되어 있기에 "참"임.

그렇기에 Olaf를 출력.

 

만약,

const name = person && person.name; 에서

person의 값이 unll이면,

name에 unll이 저장되는데 unll이면 false여서

뒤의 true인 "객체가 아닙니다." 가 return 됨.