Nullish Coalescing Operator #

2022/3/16

這次來個已知用火極短篇，第一次寫語法的筆記，單純是為了紀念用，紀錄一下對我來說比較有意義的事情~

技術會議 #

我現在的公司每週都會有個技術會議，剛好這次是子期分享 code review 的一些重點整理，其中一個講到指定預設值，建議用 or 代替三元運算子的寫法。

// bad
return avatar ? avatar : '0000';

// good
return avatar || '0000';

|| 與 ?? #

此時 Joe 就提出也可以使用??是比較新的用法，子期表示也可以，不過他記得這兩個用法好像有些微的差異，但他一時忘記了是差在哪，然後就稍微查了一下。
因為剛好那天我是居家上班，我跟我弟的電腦桌是連在一起的，我弟就全程在旁偷聽，這時候他就突然冒了一句只有null跟undefined會回傳 false，當時還沒仔細聽他在說啥，結果最後子期大大說明兩者差異時，我才回想起，疑!等等這不就跟剛剛我弟說的一樣嗎?
??只有在null跟undefined的時候會回傳預設值，詳細範例如下。

const zach = 0 || '又帥又強'; // 又帥又強
const steven = '' || '又帥又強'; // 又帥又強
const joe = false || '又帥又強'; // 又帥又強
const frank = NaN || '又帥又強'; // 又帥又強
const willian = null || '又帥又強'; // 又帥又強
const xn = undefined || '好爛'; // 好爛

const zach = 0 ?? '又帥又強'; // 0
const steven = '' ?? '又帥又強'; // ''
const joe = false ?? '又帥又強'; // false
const frank = NaN ?? '又帥又強'; // NaN
const willian = null ?? '又帥又強'; // 又帥又強
const xn = undefined ?? '好爛'; // 好爛

心得 #

其實我本來是完全不知道??這種用法的，真的是學了一課。
不過更讓我意外的是我弟居然反應這麼快，他是去年下半年才開始自學，準備轉職前端工程師，真的是很認真在學，去年他退伍後不知道要做什麼，不想考公務員也不想當翻譯，我就跟他說阿你語言能力這麼好，不然你學個程式語言如何?反正也是一種語言學學看不虧阿，於是我弟就這樣被我推坑進入了前端工程師的路。

Reference #

Nullish Coalescing Operator

新登場人物 #

Zach：
前端工程師，熱愛貓咪是個專業貓奴，對公司的小笨貓非常的好，會去幫小笨貓剪指甲、清貓砂等，是個蠻有趣的人、講話蠻幽默的，喜歡開玩笑鬧別人，有時候吐槽別人也蠻中肯的，看他跟公司其他同事逗嘴也是我上班的樂趣之一。

Willian：
全端工程師，其實我不太知道威廉是專職前端還後端，反正他都有碰而且是全遠端工程師，簡稱也可以算是全端吧，是個住在花蓮的同事，個性相當隨和，平常見不到面只聽得到聲音，我自己覺得他是聲音跟臉對不太上的人，大概就是臉像 30 歲，但是聲音只有 15 歲的那種感覺吧，去年 10 月才和其他同事一起去花蓮參加威廉的婚禮，結果新郎本人都在忙，幾乎沒有跟我們玩到。

Frank 就是子期、Steven 就是哲仰。

回到目錄