在前端开发中，我们经常会遇到不确定数据类型或者数据为空的情况。在 ES12 中，新增了可空状态（Nullable State）的数据类型，用于处理空值的情况。本篇文章将向大家介绍 ES12 中如何使用可空状态来处理空值。
什么是可空状态？
在 ES12 中，可空状态是指允许变量的值为 null 或者 undefined。在之前的 ES 版本中，声明一个变量时，如果没有给它赋值，那么它的值默认为 undefined。而在 ES12 中，你可以显式地声明一个变量的值允许为 null，这就是可空状态。
如何声明可空状态的变量
我们可以使用问号（?）来标识一个变量是可空状态的。例如：
let myVariable: string | null; // 这里说明了 myVariable 可以是 string 类型，也可以是 null 类型
上面的代码中，我们使用了“|”符号来分隔变量的类型。这意味着 myVariable 可以是 string 类型或者 null 类型。如果没有使用问号（?），那么 myVariable 的类型只能是 string，而不能是 null。
如何使用可空状态处理空值
在 ES12 中，我们可以使用一些新的语法和函数来处理空值。下面是一些常用的方式。
可空链式操作符
在之前的版本中，如果一个对象的属性值为空，你要进行取值操作的话，你需要使用繁琐的判断语句，比如：
if (obj && obj.prop1 && obj.prop1.prop2) {
console.log(obj.prop1.prop2);
}这样的判断语句会使代码变得十分冗长。而在 ES12 中，我们可以使用可空链式操作符 “?.” 来简化代码。例如：
console.log(obj?.prop1?.prop2);
在上面的代码中，如果 obj.prop1 或者 obj.prop1.prop2 的值为 null 或者 undefined，那么 console.log() 函数将不会进行调用。这样的写法不仅简化了代码结构，而且也更加容易读懂。
可空合并运算符
可空合并运算符 （??）是一个比较新的语法，可以用于处理两个值中有一个为空的情况。例如：
const myVariable = someVariable ?? defaultValue;
上面的代码中，如果 someVariable 的值为 null 或者 undefined，那么 myVariable 的值就是 defaultValue。否则，myVariable 的值就是 someVariable 的值。
可空类型断言
有时候，我们清楚一个变量的值一定会是某种类型，但 TypeScript 还是会报错。在这种情况下，我们可以使用可空类型断言，将变量转换为指定类型，例如：
const myVariable: string | null = <string>someValue;
上面的代码中，使用了一个可空类型断言 “<string>”，它将 someValue 转换为 string 类型。如果 someValue 的值为 null 或者 undefined，那么 myVariable 的值就是 null。
结论
在 ES12 中，可空状态的数据类型为我们处理空值提供了更多的选择。我们可以使用可空链式操作符、可空合并运算符以及可空类型断言来处理空值的情况。通过使用这些工具，我们可以避免繁琐的判断语句，并使代码更加简洁易懂。
-- -------------------- ---- -------
--- ----------- ------ - -----
------------------------ -- -------
----- --- - -
------ -
------ ------ --------
--
--
------------------------------- -- -------- ------
----- ------------ - -----
----- -------------- - -------- -------
----- ----------- - ------------ -- ---------------
------------------------- -- ---------- -----
----- ------------ ------ - ---- - -------------
------------------------- -- -------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/671e09c12e7021665ef54cad