JavaScript中的安全變數引用

成富發表於2018-11-26
JavaScript變數

在編寫JavaScript程式碼時，經常需要首先檢查一個變數是否為null或undefined，再訪問其中的屬性或呼叫其中的方法。典型的模式如下：

if (obj) { obj.func(); }
複製程式碼

使用if進行檢查的程式碼比較冗長，一般可以簡寫成下面的形式。

let value = obj && obj.value;

obj && obj.func(); 
複製程式碼

JavaScript目前並沒有提供Groovy或Ruby語言中那樣的安全引用操作符（?.）。比較接近的是CoffeeScript中提供了這樣的操作符。CoffeeScript中的程式碼value = a?.b?.c會被編譯成如下的JavaScript程式碼。

var ref, value;

value = typeof a !== "undefined" && a !== null ? (ref = a.b) != null ? ref.c : void 0 : void 0; 
複製程式碼

在JavaScript方面，增加安全引用操作符的提議已經存在，目前還是在第一階段。該提議的名稱是JavaScript中的可選級聯（Optional Chaining for JavaScript），使用的同樣是?.來表示該操作符。該操作符有如下幾種使用場景：

  • obj?.prop // 可選的靜態屬性訪問
  • obj?.[expr] // 可選的動態屬性訪問
  • func?.(...args) // 可選的方法呼叫

在該提議正式被新增到ECMAScript規範之後，相關的廠商會跟進實現。TypeScript也計劃在那之後新增對該操作符的支援。

相關文章