JS 新語法「可選鏈」「雙問號」已進入 Stage 3

你可能寫過這樣的代碼

var street = user.address && user.address.street;
複製代碼

有了這個新語法，你能夠寫成

var street = user.address?.street
複製代碼

你可能還寫過這樣的代碼

var fooInput = myForm.querySelector('input[name=foo]')
var fooValue = fooInput ? fooInput.value : undefined
複製代碼

有了新語法後，你能夠寫成

var fooValue = myForm.querySelector('input[name=foo]')?.value
複製代碼

但在實際使用中，仍是會有些不便，好比

const result = response?.settings?.n || 100
複製代碼

你但願若是 response 或者 response.settings 或者 response.settings.n 不存在（值爲 null 或者 undefined）時，result 保底值爲 100。

可是上面代碼在 n 爲 0 的時候，也會讓 result 變成 100，你實際上但願此時 result 爲 0。

因而你只好把代碼寫成這樣

const result = response?.settings?.n === undefined ? 100 : response?.settings?.n
複製代碼

或者你封裝一下

const result = fetch(response?.settings?.n, 100)
複製代碼

如今，你能夠用另外一個新語法——「雙問號語法」——來簡化代碼：

const result = response?.settings?.n ?? 100
複製代碼

這個 ?? 的意思是，若是 ?? 左邊的值是 null 或者 undefined，那麼就返回右邊的值。

有了這兩個語法，估計之後 JS 代碼中就會全是問號了！哈哈。