ホームページ >ウェブフロントエンド >jsチュートリアル >オプションのチェーンと Nullish Coalescing により、JavaScript での Null-Safe プロパティ アクセスがどのように簡素化されるのでしょうか?

オプションのチェーンと Nullish Coalescing により、JavaScript での Null-Safe プロパティ アクセスがどのように簡素化されるのでしょうか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-12-09 11:39:11832ブラウズ

How Do Optional Chaining and Nullish Coalescing Simplify Null-Safe Property Access in JavaScript?

EcmaScript 6 における NULL セーフなプロパティ アクセスと条件付き代入

EcmaScript 6 は、簡潔かつ効率的な方法でプロパティ アクセスと条件付き代入を合理化する強力な演算子を提供します。

条件付き代入

古い JavaScript複数のバージョンでは、try/catch ブロックを使用して目的のロジックを実現できます:

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

let value = 3;
for (let x of [true, false]) {
  try { value = query(x).value; } catch {} // Don´t assign if no .value
}
console.log(value); // Outputs: 4

Optional Chaining

今回は、Optional Chaining を使用して、このロジックを大幅に簡略化できます。

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

let value = 3;
for (let x of [true, false]) {
  value = query(x)?.value; // Assign only if `.value` exists
}
console.log(value); // Outputs: 4

?。演算子は、query(x) が null でなく未定義であるかどうかを確認し、その後でのみ value プロパティにアクセスします。 query(x) が null または未定義の場合は、エラーをスローせずに未定義を返します。

Nullish Coalescing

Null 許容値の場合は、Nullish Coalescing 演算子 (??) を使用できます。

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

let value = 3;
for (let x of [true, false]) {
  value ??= query(x).value; // Assign only if `value` is null or undefined
}
console.log(value); // Outputs: 4

??演算子は、左側のオペランドを null または未定義と比較し、true の場合は右側のオペランドを割り当てます。この場合、値は、最初に null または未定義だった場合にのみ更新されます。

これらの演算子は最新のブラウザでサポートされており、ブラウザ間の互換性のために Babel で使用できることに注意してください。

以上がオプションのチェーンと Nullish Coalescing により、JavaScript での Null-Safe プロパティ アクセスがどのように簡素化されるのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。