TypeScript里的可选链(Optional Chaining，即问号)用法 - ?.

用途：遇到null或者undefined时可以立即停止表达式的运行。

看个例子：

let a = { b: 1};

const val = a?.b;

编译之后生成的JavaScript代码：

var a = { b: 1 };
var val = a === null || a === void 0 ? void 0 : a.b;

可见，如果a为null或者void 0，会直接返回void 0，而不会接着执行a.b

因此，以后我们可以不需要编写形如

if( a && a.b){
}

这样的保护性代码。更好的写法是：

if( a?.b){
}

唯一需要注意的是，?. 与 && 运算符并不100%等价。&& 专门用于检测 falsy 值，比如空字符串、0、NaN、null 和 false 等。而 ?. 只会验证对象是否为 null 或 undefined，对于 0 或空字符串来说，并不会出现 “短路”。

可选链的另一个有用的场景是基于索引访问数组元素。

function getElement<T>(arr?: T[], index:number = 0){
	return arr?.[index];
}

编译之后的JavaScript代码：

function getElement(arr, index) {
    if (index === void 0) { index = 0; }
    return arr === null || arr === void 0 ? void 0 : arr[index];
}

使用可选链接后，不需要手动编写检查数组是否为null或undefined的保护性代码了。

可选链的第三种用法，尝试调用一个可能不存在的方法。

function myTry<T>(arr:T[]){
	for( let i = 0; i < arr.length; i++){
		(arr[i] as any).customMethod?.();
	}
}

编译后生成的JavaScript代码：

function myTry(arr) {
    var _a, _b;
    for (var i = 0; i < arr.length; i++) {
        (_b = (_a = arr[i]).customMethod) === null || _b === void 0 ? void 0 : _b.call(_a);
    }
}