# 简述
? 可选链操作符：
探测对象上否存在需要的属性或方法，存在则访问、不存在则返回 undefined， 避免程序报错
不可以用于赋值
?? 空值合并操作符：
设置默认值，只有在值为 null 或 undefined 值，值才生效，与 || 操作符类似，但更严格限制
# ? 可选链操作符 用法
? 问目标对象上存不存在某个属性，有则返回，无则短路返回 undefined，避免抛出错误
// 访问属性是否存在
const foo = {}
foo.a.b // Uncaught TypeError：Cannot read property 'b' of undefined
foo?.a?.b // undefined
1
2
3
4
5
2
3
4
5
// 访问方法是否存在
const foo = {}
foo.a() // Uncaught TypeError：foo.a is not a function
foo?.a?.() // undefined
1
2
3
4
2
3
4
// 不可以对其赋值
const foo = {}
foo.a = 3 // 可以
foo?.a = 3 // Uncaught SyntaxError: Invalid left-hand side in assignment
1
2
3
4
2
3
4
简单地说，可选操作符用于条件判断，比如简化对象属性是否存在的判断，避免出现类型错误
# ?? 空值合并操作符 用法
没什么好说的，注意当为 null 或 undefined 时，才生效
(null ?? 1) // 1 生效
(undefined ?? 1) // 1 生效
('' ?? 1) // '' 不生效
(0 ?? 1) // 0 不生效
(false ?? 1) // false 不生效
// 但 '' 0 false 使用 || 判断则生效
('' || 1) // 1
(0 || 1) // 1
(false || 1) //1
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# ? 或 ?? 配合使用
绝配。
可选链接操作符 访问对象属性失败时，返回 undefined
空值合并操作符 对 undefined 生效，返回设置的默认值
const foo = {}
foo?.a ?? 1
1
2
2
# ?? 与 || 配合使用
用小括号强调优先级，否则报错
null || undefined ?? 'foo' // Uncaught SyntaxError: Unexpected token '??'
(null || undefined) ?? 'foo' // foo
1
2
3
2
3
扫一扫，微信中打开
