js ?.是什么意思
引言
在JavaScript中，?. 是一个新的运算符，它被称为”可选链式操作符”。它的引入极大地简化了我们在处理可能为null或undefined的属性时的代码逻辑。本文将详细介绍?.运算符的使用方式，并给出一些实际的示例代码来说明它的作用。
1. 概述
以往在处理可能为null或undefined的属性时，我们通常使用短路逻辑或条件判断来确保属性的安全访问，例如：
let name = user && user.name;
这样的代码会增加我们的代码量，并且可读性较差。而有了?.运算符，我们可以按照更简洁的方式来处理这类情况，如下所示：
let name = user?.name;
如果user为null或undefined，那么user.name将返回undefined，而不会抛出TypeError错误。
2. 可选链式操作符的使用方式
?.运算符的使用方式如下所示：
obj?.prop // 如果obj为null或undefined，返回undefined，否则返回obj.prop的值
obj?.[prop] // 如果obj为null或undefined，返回undefined，否则返回obj[prop]的值
func?.(args) // 如果func为null或undefined，返回undefined，否则以args作为参数调用func，并返回结果
2.1 对象属性的可选访问
当我们希望安全访问一个某个对象的属性时，可以使用?.运算符，例如：
let user = {
name: 'Alice',
age: 30
};
console.log(user?.name); // 'Alice'
console.log(user?.address); // undefined
如果user对象为null或undefined，user?.name将返回undefined。而如果user?.address，由于user对象没有address属性，也将返回undefined。
2.2 数组元素的可选访问
与对象属性一样，可选链式操作符也适用于数组元素的访问，例如：
let arr = [1, 2, 3];
console.log(arr?.[0]); // 1
console.log(arr?.[5]); // undefined
如果数组为null或undefined，或者索引超出了数组的长度，都会返回undefined。
2.3 函数调用的可选执行
可选链式操作符还可以用于函数的安全调用，如果函数存在，则执行它，否则返回undefined，例如：
let obj = {
sayHello: function() {
console.log('Hello!');
}
};
obj?.sayHello(); // 'Hello!'
obj?.sayGoodbye(); // undefined
如果对象obj中的sayHello函数存在，那么obj?.sayHello()将输出’Hello!’，否则obj?.sayHello()将返回undefined。
3. 可选链式操作符的嵌套使用
可选链式操作符可以嵌套使用，用于对深层嵌套的属性进行安全访问。例如：
let user = {
name: 'Alice',
address: {
city: 'Shanghai',
postcode: 123456
}
};
console.log(user?.address?.city); // 'Shanghai'
console.log(user?.address?.street?.name); // undefined
在这个示例中，如果user.address.city存在，则会输出’Hello!’，否则返回undefined。另外，如果user.address.street.name嵌套的属性不存在，也会返回undefined。
4. 与其他操作符的结合使用
可选链式操作符可以与其他操作符进行结合使用，例如：?.与||运算符结合使用来提供一个默认值：
let user = {
name: 'Alice',
age: 30
};
let name = user?.name || 'Unknown';
console.log(name); // 'Alice'
let gender = user?.gender || 'Unknown';
console.log(gender); // 'Unknown'
在这个示例中，如果user不存在，user?.name将返回undefined，然后undefined || 'Unknown'将返回’Unknown’作为name的默认值。
5. 可选链式操作符的浏览器兼容性
目前（截至2021年9月），?.运算符已在大多数主流的现代浏览器中得到支持，包括Chrome，Firefox，Safari和Edge。唯一明显的不支持该运算符的浏览器是Internet Explorer。
结论
?.运算符是一种非常实用的特性，它可以简化我们处理可能为null或undefined的属性时的代码逻辑。通过使用可选链式操作符，我们可以更安全地访问属性、数组元素和调用函数，同时也可以与其他运算符结合使用。它的引入使得我们的代码更加简洁、可读性更高。