ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptのnull値合体演算子(??)の詳しい解説

JavaScriptのnull値合体演算子(??)の詳しい解説

青灯夜游
青灯夜游転載
2020-12-02 18:02:513314ブラウズ

この記事では、JavaScript の null 値結合演算子 (??) を紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

JavaScriptのnull値合体演算子(??)の詳しい解説

今年 ECMAScript 2020 (ES2020) がリリースされます。 2015 年の ECMAScript 2015 (ES6) のリリース以来、JavaScript 言語を毎年更新してきました。

#ディレクトリ

    JavaScript の null 値合体演算子の使用
  • 使用例
  • null 値演算子と論理 OR の組み合わせ (
  • ||)
  • ブラウザのサポート
  • 概要
ES2020 では、以前から利用可能であった機能が追加されました。 C# や PHP などの他の言語の場合:

Null Coalescing Operator。この名前を言うたびに賢い気分になるので、私はこの名前がずっと好きです。

null 値合体演算子はリストを走査し、
null または unknown ではない最初の値を返します。
null 合体演算子は

null または null 値のみを検索することに注意することが重要です。 null 合体演算子は、偽の値 (偽の値) を受け入れます。

JavaScript null 合体演算子の使用 (??)

いくつかの例を見てみましょう。 JavaScript の null 合体演算子は、

非 null または未定義の オブジェクトが見つかるまで ?? チェーンをたどることに注意してください。 false が見つかった場合は、その値が返されます。

null      ?? 'hi'       // 'hi'
undefined ?? 'hey'      // 'hey'

false     ?? 'hola'     // false
0         ?? 'bonjour'  // 0
'first'   ?? 'second'   // first

次の例では、いくつかの値を変数に保存します:

let person  // <-- person is undefined here

person ?? { name: &#39;chris&#39; }       // { name: &#39;chris&#39; }

const isActive = false

isActive ?? true             // false

JavaScript の null 値合体演算子をリンクする

JavaScript の null 合体演算子の優れた点は、必要に応じて何度でも連鎖できることです。

null ?? undefined ?? false ?? &#39;hello&#39;     // false
null ?? &#39;&#39; ?? &#39;hello&#39;                     // &#39;&#39;

使用例

外部ソースからデータを取得する場合に使用できます。たとえば、複数の場所からブログ記事をクロールしたいとします。次に、どの投稿が注目の投稿になるかを決定できます。

// 简化代码。 使用 fetch requires 需要比这更多的代码
const firstBlogPost = await fetch(&#39;...&#39;)
const secondBlogPost = await fetch(&#39;...&#39;)
const defaultBlogPost = { title: &#39;Default Featured Post&#39; }

const featuredBlogPost = firstBlogPost ?? secondBlogPost ?? defaultBlogPost

上記は、特定の値が存在するかどうかわからない場合にデフォルト値を設定する良い方法です。

空の合体演算子と論理 OR (||<span style="font-size: 18px;"></span>)

必要な場合削除 仮想値の場合は、

論理 OR 演算子 (||) を使用できます。

本質的には、虚数を削除する点を除いて、null 合体演算子と同じことを行います。
    NULL 値合体演算子は
  • null未定義
  • 論理 OR 演算子は
  • null をスキップします、unknownfalse
  • false ?? &#39;hello&#39;    // false
    false || &#39;hello&#39;    // &#39;hola&#39;
仮想値を使用したくない場合は、

|| を使用できます。 null または unknown であるかどうかを確認したいだけの場合は、?? を使用します。

ブラウザのサポート

この記事の執筆時点では、null 合体演算子は Chrome、Firefox、Edge、Safari の最新バージョンで利用できます。

JavaScriptのnull値合体演算子(??)の詳しい解説

#概要

null 合体演算子は、JavaScript 言語への優れた追加機能です。より多くのチェック値を持つオプションがあっても問題はありません。

英語の元のアドレス: https://scotch.io/tutorials/javascripts-null-coalescing-operator

著者: Chris on Code

翻訳アドレス: https://segmentfault.com/a/1190000023577464

プログラミング関連の知識については、
プログラミング入門

をご覧ください。 !

以上がJavaScriptのnull値合体演算子(??)の詳しい解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。