JS "??"의 Nullish 병합 연산자 ?
3430 단어 webdevjavascriptes6

나는 그것에 대해 더 배우기로 결정했습니다. 그래서 이 블로그. 가능한 한 간단하고 초보자에게 친숙하게 유지하려고 노력할 것입니다.
좋아, 그럼 바로 들어가자!
도대체 "??"가 뭐야? ?
null 병합 연산자는 구문적으로 '??'로 정의됩니다.
기본적으로 'null' 및 '정의되지 않은' 값을 계속 주시합니다.
예제를 통해 방법을 살펴보겠습니다.
다음 표현식이 있다고 가정합니다.
const fruitCount = noOfApples ?? noOfOranges그러면 과일의 가치는 사과의 가치에 따라 달라질 것입니다. noOfApples가 null or undefined이면 fruitCount의 값은 noOfOranges와 같습니다. 반대로 noOfApples의 값이 null 또는 undefined 이외의 값이면 fruitCount는 noOfApples와 같습니다.내용을 요약하면 다음과 같습니다.
a??b 와 같은 식에서 결과는 다음과 같습니다.a , a에 null 또는 undefined 이외의 값이 있는 경우. b , a가 null 또는 undefined인 경우. 기본적으로 구문 설탕입니다.
result = (a !== null && a !== undefined) ? a : b; Nullish 병합 연산자의 일반적인 사용 사례
1) 변수에 기본값 할당
null 병합 연산자를 사용하면 할당되지 않은 변수에 기본값을 쉽게 제공할 수 있습니다.
예를 들어,
let count;const sum = count ?? 0;위의 예에서 count는 값으로 초기화되지 않았기 때문에 sum의 값은 이 경우
0인 두 번째 피연산자에 의해 제공됩니다.2) 정의되지 않은/null 값 목록에서 선택
사용자 이름을 표시해야 하는 시나리오를 고려해 보겠습니다.
let firstName = null;let lastName = null;let nickName = "Coldpigli";// shows the first defined value:console.log(firstName ?? lastName ?? nickName ?? "User");// Coldpigli위의 예에서
Coldpigli와 firstName가 lastName이고 null가 "정의된"값("??"의미)을 제공하므로 nickName가 기록됩니다.알겠습니다. 하지만 '||'과 어떻게 다릅니까? ?
||는 ??로 사용할 수 있지만 || 사용에 주의가 필요한 경우가 있습니다.그들 사이의 중요한 차이점은 다음과 같습니다.
즉,
|| 는 false , 0 , 빈 문자열 "" 및 null/undefined 를 구분할 수 없습니다.이것은
0 또는 false를 값으로 처리하고 값이 없는 것이 아니라 처리하려는 경우 심각한 문제가 될 수 있습니다.예를 들어 이해해 봅시다.
let count = 0;
console.log(count || 100); //100
console.log(count ?? 100); //0
카운트 0은 무언가를 세는 변수에 대해 완벽하게 유효한 값이 될 수 있습니다.
count || 100는 높이가 거짓 값인지 확인하고 0는 거짓입니다.결과는 || 두 번째 인수인 100입니다.
count ?? 100 검사는 null/정의되지 않은 것으로 간주되며 그렇지 않습니다.따라서 결과는 "있는 그대로", 즉 0으로 계산됩니다.
?? 사용 && 또는 ||
Javascript는
?? 또는 &&와 함께 ||를 사용하는 것을 금지합니다.따라서
a = b && c || d와 같은 식은 구문 오류가 발생합니다.그러나 주변에 방법이 있습니다.
다음과 같이
()를 사용하여 사용 우선순위를 명시적으로 지정할 수 있습니다.a = (b && c) || d .위의 내용은 완벽하게 유효한 Javascript 표현입니다.
자, 이것으로 이 블로그를 마칩니다. 나는 nullish 병합 연산자가 더 이상 위협적으로 들리지 않기를 바랍니다.
다음 시간까지 여러분!
Reference
이 문제에 관하여(JS "??"의 Nullish 병합 연산자 ?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/coldpigli/nullish-coalescing-operator-in-js--4l2c텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)