>웹 프론트엔드 >JS 튜토리얼 >Optional Chaining과 Nullish Coalescing은 어떻게 JavaScript의 조건부 할당을 개선합니까?

Optional Chaining과 Nullish Coalescing은 어떻게 JavaScript의 조건부 할당을 개선합니까?

Susan Sarandon
Susan Sarandon원래의
2024-12-21 01:27:10847검색

How Do Optional Chaining and Nullish Coalescing Improve Conditional Assignments in JavaScript?

EcmaScript 6의 선택적 연결 및 조건부 할당

조건부 할당 및 null 안전 속성 액세스를 단순화하기 위한 노력의 일환으로 EcmaScript 6에서는 여러 가지 기능을 도입했습니다. 코드 효율성을 향상시키는 연산자와 가독성.

선택적 체이닝(ECMAScript 2020)

?로 표시되는 선택적 체이닝. 연산자를 사용하면 nullable 속성을 안전하게 탐색할 수 있습니다. 귀하의 예에서는 선택적 연결을 사용하여 4행을 단순화할 수 있습니다.

const query = succeed => (succeed ? { value: 4 } : undefined);

let value = 3;
for (let x of [true, false]) {
  value = query(x)?.value;
}
// Output: 4

Nullish Coalescing Assignment(ECMAScript 2021)

조건부 할당의 경우 Nullish Coalescing 할당 연산자 ??=를 사용할 수 있습니다. 해당 피연산자가 null 또는 정의되지 않은 것으로 평가되는 경우에만 왼쪽 피연산자에 값을 할당합니다. 이렇게 하면 try-catch 블록이나 명시적인 null 검사가 필요하지 않습니다.

query(x)?.value ??= value;

고려 사항 및 대안

  • 대상 호환성: 선택적 연결 및 nullish 병합 할당은 최신 브라우저 및 EcmaScript에서 지원됩니다. 각각 2020년과 2021년. 특정 환경에 대한 호환성을 확인하려면 "Can I Use"(https://caniuse.com/)를 사용하세요.
  • Babel 플러그인: 이전 환경의 경우 Babel 플러그인을 사용하여 트랜스파일할 수 있습니다. 이러한 연산자를 호환 가능한 구문으로 변환합니다.
  • CoffeeScript 대안: CoffeeScript 관용구 query(x).value 쿼리(x)?.값? 유사한 동작을 달성하지만 반복이 필요합니다.
  • 객체 속성 액세스: 객체 속성을 설정하는 경우 ??= 연산자는 속성이 아직 할당되지 않은 경우에만 할당이 발생하도록 보장합니다. . 이렇게 하면 불필요한 setter 호출을 피할 수 있습니다.
  • 함수 추상화: 조건부 할당은 함수 호출로만 표현할 수 없기 때문에 논리를 함수로 추상화하는 것은 불가능합니다.

위 내용은 Optional Chaining과 Nullish Coalescing은 어떻게 JavaScript의 조건부 할당을 개선합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.