typescript 可选链运算符怎么使用

TypeScript 的可选链运算符（Optional Chaining Operator）可以用来简化访问深层嵌套对象的代码，并且避免因为访问不存在的属性而导致的运行时错误。下面是使用可选链运算符的示例代码：

interface Person {
  name?: string;
  age?: number;
  address?: {
    city?: string;
    street?: string;
  };
}

const person: Person = {
  name: 'Alice',
  age: 20,
};

console.log(person.address?.city); // undefined
console.log(person.address?.street?.toUpperCase()); // undefined

在上面的代码中，我们定义了一个 `Person` 接口，它包含了一个可选的 `address` 属性，`address` 属性又包含了两个可选的属性 `city` 和 `street`。我们创建了一个 `person` 对象，它只包含了 `name` 和 `age` 属性，没有 `address` 属性。使用可选链运算符，我们可以安全地访问 `person.address.city` 和 `person.address.street`，即使 `address` 属性不存在或者 `city` 和 `street` 属性不存在，也不会导致运行时错误。在这种情况下，`console.log` 语句会输出 `undefined`。

需要注意的是，可选链运算符只能用于访问属性，不能用于调用方法。如果需要调用方法，可以使用 nullish 合并运算符（`??`）来确保方法存在。例如：

const name = person.name ?? 'Unknown';

这里使用 nullish 合并运算符来判断 `person.name` 是否为 null 或 undefined，如果是，则使用默认值 `'Unknown'`。