REACT 폐관수련ing

나만 몰랐던 JS 신문법

let user = {
	name : 'dobbi'
	age : 1234
};

console.log(user?.age)

🦭 ?를 기준으로 왼쪽이 비어있다면 ?의 오른쪽 출력X
?. : optional chaining 연산자
?.왼쪽이 null || undefined면 undefined남겨줌

언제쓰면 좋을까요 ?
중첩된 obj자료에서 자료 뽑을 때 reference 에러없이 안전하게 뽑을 수 있다고 함

예를들어

let user = {
	name : 'dobbi'
	//age : {value:1234}
};

console.log(user.age.value)            

이럴 땐 Cannot read 어쩌구 하면서 에러뜸 => console 아래의 코드가 읽히지 않음 => 큰일남

let user = {
	name : 'dobbi'
	//age : {value:1234}
};

console.log(user.age?.value)            

이러면 undefined가 출력되면서 에러가 안뜸

즈기요 그럼 이럴때도 써도 되는겁니꺼 ?

let user = {
	name : 'dobbi'
};

console.log(user?.age)            

정답은 굳이? 입니다
왜냐하면 저런경우 console.log(user.age)이라고 코드를 작성해도
JS가 알아서 undefined를 출력해주기 때문이죠 후후

그란데 말입니다

let user = {
	name : 'dobbi'
};

console.log(user.age.value)            

이렇게 쓰면 Cannot read 어쩌고 에러납니다
undefined.value (혹은 null값이라면 null.value)일 때는 에러가 나는게 당연하니깐요

그러니까 앞전에 말한 것 처럼 중첩된 obj자료에서 자료 뽑을 때 사용하는거죠
🥰 이해가 안간다구요 ? 그럼 당신은 도덕책

세상에 그럼 설마 JS에서도 활용이..?
가능합죠

document.querySelector('#a')?.innerHTML

셀렉터에 활용할 수 있긴하죠
근데 에러를 해결해주는 문법 아님

let user = {
	name : 'dobbi'
};

console.log(undefined ?? '으잉')            

🦭 ??의 왼쪽부분이 undefined, null이면 ??의 오른쪽 부분을 보여주세요
?? nullish coalescing 연산자

언제쓰면 좋을까요 ?

let user
// user에 데이터가 엄청 있다고 가정

console.log(user)            

만약 데이터가 3초 후에 도착한다면 ?

let user
// user에 데이터가 엄청 있다고 가정

console.log(user ?? '로딩중')            

이런식으로 코드를 작성하면 data가 없을 때(클라이언트로 도착하기 전)
변수같은 것을 조금 더 안전하게 보여줄 수 있다

오늘의 출처 : 사과센세 영상 정리한 내용

오늘의 일기

우리 안그래도 data값 안들어와서 렌더 여러번 되는 이슈때문에 골머리 앓고 있었는데
운좋게 이런 기능을 알게되다니...!

아니 나만 이제안거야? 그런거면 미안

뭘봐 이제알수도있지 뭘보냐고

---

Sae Eleisa Tera Vi