在 TypeScript 中使用 ES11 功能
随着 JavaScript 的不断发展，新的语言特性和功能不断涌现。ES11 是 ECMAScript 的最新版本，它引入了一些非常有用的功能，如可选链操作符、空值合并操作符、BigInt 等。在 TypeScript 中使用这些新功能可以提高代码的可读性和可维护性。本文将介绍在 TypeScript 中使用 ES11 功能的方法，并提供一些示例代码。
- 可选链操作符
可选链操作符（Optional Chaining Operator）是 ES11 中的一个新功能，它可以避免代码中的 null 或 undefined 异常。在 TypeScript 中，我们可以使用可选链操作符来访问对象的属性或方法，如果属性或方法不存在，则返回 undefined。
示例代码：
-- -------------------- ---- -------
--------- ---- -
----- -------
----- -------
--------- -
------ -------
--------- -------
-
-
-------- ------------- ------ ------ -
------ ------------------- -- ----------
-
----- ------ ---- - -
----- --------
---- ---
-------- -
----- ---- ------
-------- -----
-
--
---------------------------- -- ------- --- ----
----- ------ ---- - -
----- ------
---- --
--
---------------------------- -- ------- -------在上面的示例中，我们定义了一个名为 User 的接口，它包含一个可选的 address 属性。我们还定义了一个名为 getCity 的函数，它使用可选链操作符来获取用户的城市。如果用户没有地址信息，则返回 'unknown'。
- 空值合并操作符
空值合并操作符（Nullish Coalescing Operator）也是 ES11 中的一个新功能，它可以用来判断一个值是否为 null 或 undefined，如果是，则返回一个默认值。在 TypeScript 中，我们可以使用空值合并操作符来处理变量的默认值。
示例代码：
function printMessage(msg?: string) {
console.log(msg ?? 'Hello, world!');
}
printMessage(); // Output: Hello, world!
printMessage('Hi, there!'); // Output: Hi, there!在上面的示例中，我们定义了一个名为 printMessage 的函数，它接受一个可选的 msg 参数。我们使用空值合并操作符来判断 msg 是否为 null 或 undefined，如果是，则输出默认消息 'Hello, world!'。
- BigInt
BigInt 是 ES11 中另一个新功能，它可以处理大整数的计算。在 TypeScript 中，我们可以使用 BigInt 来处理超出 JavaScript Number 类型范围的整数。
示例代码：
const num1 = 9007199254740991n;
const num2 = BigInt('9007199254740991');
console.log(num1); // Output: 9007199254740991n
console.log(num2); // Output: 9007199254740991n
console.log(num1 + 1n); // Output: 9007199254740992n
console.log(num2 + 1n); // Output: 9007199254740992n在上面的示例中，我们定义了两个 BigInt 类型的变量 num1 和 num2。我们可以使用字面量或 BigInt 函数来创建 BigInt 类型的变量。我们还可以使用基本的算术运算符来进行计算，包括加、减、乘、除和取余。
结论
在 TypeScript 中使用 ES11 功能可以提高代码的可读性和可维护性。可选链操作符和空值合并操作符可以避免代码中的 null 或 undefined 异常，BigInt 可以处理超出 JavaScript Number 类型范围的整数。我们应该根据项目的需要，合理地使用这些新功能，以提高代码的质量和效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6760fa5803c3aa6a5607b29e