Conditional-rendering

문혜민·2022년 3월 28일
0

부정연산자
!true
->false
!"사과"
->false
!!"사과"(이중으로 부정되서 긍정이됨!)
->false
!false
->true

**옵셔널 체이닝
조건부렌더링을
data && data 참이면 뒤에거가 보여짐
data|| data 거짓이면 뒤에사 보여짐

data && data ===> data? 로 표현할수있음

**삼항연산자
조건 ? 참 : 거짓

한줄로 표현될때만 사용하는게 좋음 가독성 떨어짐

거짓
숫자 0 ,
str ""(띄어쓰기라도 들거가게되면 참으로 도출됨) ,
boolean false,
null(비어있는데 개발자가 직접 비게 했을때 undefionded 말고 null값으로 비우는게 국룰! 그래서 null이 뜬다) ,
undefinded(비어있는데) ,
Nan

nullish-coalescing
null과 undefinded 를 묶어서 한가지 값을 보임

ex) data??data.fetchPtofile (data가 거짓중에서도 null/undefinded 이면 뒤를 렌더링)

"사과" && "안녕하세요"
->'안녕하세요'
""&&"안녕하세요"
->''
""||"반갑습니다."
->'반갑습니다.'
"사과"||"반갑습니다."
->'사과'
0 ||"안녕하세요."
->'안녕하세요.'
false ||"고맙습니다."
->'고맙습니다.'
null ||"미안합니다."
->'미안합니다.'
undefined || "고맙습니다."
->'고맙습니다.'
undefined ?? "고맙습니다."
->'고맙습니다.'
null ?? "미안합니다."
->'미안합니다.'
0 ?? "고맙습니다."
->0

profile
프론드엔드 06

0개의 댓글