在 javascript 中使用可選鏈接的鑄造類型

Question

我們可以通過做安全訪問更深層次的 object

data?.user?.age

但我可以在同一行進行鑄造嗎？

const ageInNumber = +data?.user?.age!

typescript 不會拋出錯誤，但我不確定它不會給我帶來麻煩。

Answer 1

如果其第一個操作數是null或undefined ，則可選鏈接運算符 ( ?. ) 返回undefined 。

將undefined轉換為數字不會引發任何異常，只是默默地返回NaN 。 如果這對你來說是可以接受的，那么那部分就可以了。

但是，非空斷言 ( ! ) 是有問題的。 根據這個 GitHub 問題，TS 評估a?.b! 作為(a?.b)! ，斷言整個鏈，而不僅僅是.b部分。 所以：

• 如果沒有一個部分可能是無效的，那么?. 是多余的，您應該將它們替換為常規的屬性訪問 ( . ) 以增加清晰度。

• 如果任何部分可以為 nullish ，它將與undefined短路，並且違反了非 null 斷言。 如果是這種情況，您應該刪除斷言。

  但是，如果最后一部分（即data.user的age屬性）可以是null （不是undefined ），則整個鏈返回null ，它強制轉換為0 ，因此與數據中接收到的實際零無法區分。 要使其也為NaN （或設置默認值），您可以使用 nullish-coalescing 運算符 ( ?? )：

   const ageInNumber = +(data?.user?.age?? NaN)