引言
TypeScript 是目前前端工程师们使用最广泛的静态类型语言之一，有着流行的原因。TypeScript 具有更好的代码补全、更高的可靠性和更好的可维护性。然而，虽然 TypeScript 有很多优点，但是它并不是完美的。 strict null checks 是 TypeScript 2.0 中引入的一个新的特性，它提高了 TypeScript 的可靠性，但是同时也带来了一些挑战，需要在使用时注意细节。这篇文章将详细讲解 strict null checks 在 TypeScript 中的使用和相关知识点。
什么是 strict null checks
strict null checks 是 TypeScript 引入的一项新功能，目的是在编译期强制检查变量是否为 null 或 undefined, 并禁止在没有进行判断的情况下对这些变量进行操作。这里的检查不仅包括检查变量的值是否为 null 或 undefined,还包括变量的类型是否允许这些值。
如何启用 strict null checks
默认情况下，TypeScript 没有启用 strict null checks，在 tsconfig.json 文件中需要添加一个选项 'strictNullChecks' 以启用。该选项可以为 true 或 false，如果为 true 则启用严格的空检查。
下面是一个启用了 strict null checks 的 tsconfig.json 示例。
-
------------------ -
--------- ------
--------- -----------
------------------- -----
--------- ----
-
-如何使用 strict null checks
在启用 strict null checks 后，一些常见的操作就会出现错误。比如我们常常用到的声明变量时不进行初始化的操作，在启用 strict null checks 后就会提示错误：
--- -- ------- ---------------
TypeScript 编译时会提示 “Variable 'a' is used before being assigned.” 错误，提示变量 a 未初始化。修复方法是给变量 a 赋值即可。这是 TypeScript 通过启用 strict null checks 可以帮助我们发现的潜在错误。
此外，在 TypeScript 中进行属性访问操作也可能会报错。比如下面的代码：
--- -- - ------ ------ - - --- ---------------------------
这段代码会提示错误 “Object is possibly 'undefined'.”。虽然我们看到了 x 对象中定义了 test 属性，但是 test 属性是可选的，也就是说 x.test 可能是 undefined，而 undefined 并没有 length 属性。这种情况下可以使用 optional chaining （可选链操作符）来避免错误。
--- -- - ------ ------ - - --- ----------------------------
可选链操作符会在访问属性或者方法之前判断对象是否为null或undefined，如果是则直接返回undefined。
操作符
在启用 strict null checks 后，我们需要额外注意一些操作符的使用。
非空断言操作符
非空断言操作符 “!” 表示变量不为 null 或 undefined，比如下面的代码：
--- -- ------ - --------- - -------- -----------------------
上面的代码添加了非空断言操作符 “!”，来告诉 TypeScript 变量 x 是有值的，不会是 null 或 undefined。如果变量为 null 或 undefined，运行时会抛出异常。
注意，因为使用非空断言操作符可能导致运行时出现异常，所以不建议滥用。
类型断言操作符
类型断言 “as” 也可以用来避免 strict null checks 的错误：
--- -- ------ - --------- - ---------- -------------- -- ----------------
上面的代码强制将 x 的类型断言为字符串类型，这样访问 length 属性就不会报错了。然而需要注意的是，类型断言操作符也可能会导致无关的错误，所以也要注意使用。
实际应用
strict null checks 可以帮助我们发现代码中潜在的错误，提高代码的可靠性，但是在实际开发中 strict null checks 还有其他的应用。
排除潜在错误
我们可以通过 strict null checks 来跟踪变量的类型是否允许 null 或 undefined，进而发现潜在的错误。例如，下面的代码中，TypeScript 能够发现 getMarried 函数可能会返回 null 或 undefined：
-------- --------------------- --------- - ----------- ------ - - --------- -
-- ----------- -
------ - ----------- ------- --
-
-
----- ---------- - ------------------------------------在上面的代码中，getMarried 函数有一个 isMarried 参数。如果 isMarried 的值为 true，函数返回一个具有 spouseName 属性的对象，否则函数返回 undefined。我们使用了可选链操作符来避免 undefined 的错误，但是使用 strict null checks 后，TypeScript 还可以帮助我们检测到 getMarried 函数返回 undefined 的潜在情况，我们可以通过下面的代码来达到同样的效果并预防这种潜在错误：
-------- --------------------- --------- - ----------- ------ - -
-- ----------- -
------ - ----------- ------- --
-
------ - ----------- -- --
-
----- ---------- - ------------------------------------在上面的代码中，getMarried 函数的返回类型变成了 { spouseName: string }，这样 TypeScript 就不能将函数的返回值当作 null 或 undefined 了，此时代码运行不会出错。
函数默认值
strict null checks 还可以帮助我们编写更好的函数默认值。在 TypeScript 中，我们可以在函数参数中指定参数的类型和默认值。例如，下面的代码是一个简单的函数：
-------- ----------- ------ - -------- - ------ ------- ---------- -
不过对于可能是 null 或 undefined 的参数，我们需要特别处理。下面的代码则可以处理入参可能为 null 或 undefined 的函数，并给一个默认值：
-------- ------------ ------- - ----- ------- - ------- ------ -- ----------- ------ -------- -
在上面的代码中，我们通过可选链操作符 ?? 指定了默认值，而且 TypeScript 还可以通过类型检查确保 name 为 string | undefined 类型。这样，就能够避免发生潜在错误。
结论
通过本文，我们了解了 strict null checks 的基本知识，并在实际应用中使用了相关的操作符和语法，发现并避免了代码中的潜在错误。这可以为我们编写高质量的代码提供一定的帮助。
示例代码
下面是本文中提到的所有代码示例。
--- -- -------
---------------
--- -- - ------ ------ - - ---
---------------------------
--- -- - ------ ------ - - ---
----------------------------
--- -- ------ - --------- - --------
-----------------------
--- -- ------ - --------- - ----------
-------------- -- ----------------
-------- --------------------- --------- - ----------- ------ - - --------- -
-- ----------- -
------ - ----------- ------- --
-
-
----- ---------- - ------------------------------------
-------- --------------------- --------- - ----------- ------ - -
-- ----------- -
------ - ----------- ------- --
-
------ - ----------- -- --
-
----- ---------- - ------------------------------------
-------- ----------- ------ - -------- -
------ ------- ----------
-
-------- ------------ ------- -
----- ------- - ------- ------ -- -----------
------ --------
-来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6710e775ad1e889fe2fca8a6