本篇文章帶大家來了解JavaScript的空值合併運算子(??)。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。
今年ECMAScript 2020(ES2020)將會發佈!自 2015 年 ECMAScript 2015(ES6)發布以來,我們每年都會對 JavaScript 語言進行更新。
目錄
||
)在ES2020中,我們獲得了在其他語言中( 如C# 和PHP)早已可用的功能:空值合併運算子。我一直喜歡這個名字,因為每當我說這個名字時,我都會覺得自己很聰明。
空白值合併運算子將會遍歷列表,並傳回第一個不是 null 或 undefined 的值。
重要的是要注意,空值合併運算子只尋找 null
或 null
值。空值合併運算子接受虛值(Falsy values)。
讓我們來看一些範例。請記住,JavaScript 的空值合併運算子將遵循 ??
鏈,直到找到非空或未定義的物件。如果找到 false
,它將傳回該值。
null ?? 'hi' // 'hi' undefined ?? 'hey' // 'hey' false ?? 'hola' // false 0 ?? 'bonjour' // 0 'first' ?? 'second' // first
在下面的範例中,我們在變數中儲存了一些值:
let person // <-- person is undefined here person ?? { name: 'chris' } // { name: 'chris' } const isActive = false isActive ?? true // false
連結JavaScript 的空值合併運算子
JavaScript 的空值合併運算子的妙處在於,我們可以根據需要將其進行多次連結。
null ?? undefined ?? false ?? 'hello' // false null ?? '' ?? 'hello' // ''
可以從外部來源取得資料時使用。例如我們想從多個地方抓取部落格的文章。然後可以確定哪一篇文章將會成為我們的精選貼文:
// 简化代码。 使用 fetch requires 需要比这更多的代码 const firstBlogPost = await fetch('...') const secondBlogPost = await fetch('...') const defaultBlogPost = { title: 'Default Featured Post' } const featuredBlogPost = firstBlogPost ?? secondBlogPost ?? defaultBlogPost
如果不確定某些值是否存在,上面是設定預設值的好方法。
<span style="font-size: 18px;">||</span>
#)邏輯或運算子 (||)。
,
undefined
,
undefined,
false
false ?? 'hello' // false false || 'hello' // 'hola'
||。如果只想檢查是否為
null 或
undefined#,就用
??。
英文原文網址:https://scotch.io/tutorials/javascripts-null-coalescing-operator作者:Chris on Code#譯文地址: https://segmentfault.com/a/1190000023577464更多程式相關知識,請造訪:
程式設計入門! !
以上是詳解JavaScript的空值合併運算子(??)的詳細內容。更多資訊請關注PHP中文網其他相關文章!