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 代码中就会全是问号了！哈哈。