You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
在这篇文章中,我们将讨论发布于 TypeScript 2.0 中的 non-nullable 类型,这是对类型系统的一个重大的改进,该特性可对 null 和 undefined 的检查。cannot read property 'x' of undefined 和 undefined is not a function 在 JS 中是非常常见的错误,non-nullable 类型可以避免此类错误。
let name: string;
name = "Marius"; // OK
name = null; // OK
name = undefined; // OK
let age: number;
age = 24; // OK
age = null; // OK
age = undefined; // OK
let isMarried: boolean;
isMarried = true; // OK
isMarried = false; // OK
isMarried = null; // OK
isMarried = undefined; // OK
以 number 类型为例。它的域不仅包括所有的IEEE 754浮点数,而且还包括两个特殊的值 null 和 undefined
// 使用 --strictNullChecks 编译
let name: string;
name = "Marius"; // OK
name = null; // Error
name = undefined; // Error
let age: number;
age = 24; // OK
age = null; // Error
age = undefined; // Error
let isMarried: boolean;
isMarried = true; // OK
isMarried = false; // OK
isMarried = null; // Error
isMarried = undefined; // Error
在这篇文章中,我们将讨论发布于 TypeScript 2.0 中的
non-nullable
类型,这是对类型系统的一个重大的改进,该特性可对null
和undefined
的检查。cannot read property 'x' of undefined
和undefined is not a function
在 JS 中是非常常见的错误,non-nullable
类型可以避免此类错误。null 和 undefined 的值
在 TypeScript 2.0 之前,类型检查器认为
null
和undefined
是每种类型的有效值。基本上,null
和undefined
可以赋值给任何东西。这包括基本类型,如字符串、数字和布尔值:以
number
类型为例。它的域不仅包括所有的IEEE 754浮点数,而且还包括两个特殊的值null
和undefined
对象、数组和函数类型也是如此。无法通过类型系统表示某个特定变量是不可空的。幸运的是,TypeScript 2.0 解决了这个问题。
严格的Null检查
TypeScript 2.0 增加了对 non-nullable 类型的支持,并新增严格
null
检查模式,可以通过在命令行上使用——strictNullChecks
标志来选择进入该模式。或者,可以在项目中的 tsconfig.json 文件启用strictnullcheck
启用。在严格的
null
检查模式中,null
和undefined
不再分配给每个类型。null
和undefined
现在都有自己的类型,每个类型只有一个值如果咱们在编译前时启用了严格的
null
检查,如果将null
或undefined
分配给任何变量都会导致类型错误那么,如何在 TypeScript 2.0 中使变量为空?
用联合类型构建可空性
由于在启用严格的
null
检查时,类型在默认情况下是不可空的,所以我们需要显式指定可为空,并告诉类型检查器我们希望哪些变量为空。我们通过构造一个包含null
或undefined
类型的联合类型来实现这一点注意,
undefined
不是name
变量的有效值,因为联合类型不包含undefined
类型这种可空性方法的一大优点是,类型中哪些成员是可空的变得很明显,并且可以自文档化。以这个简单的
User
类型为例:我们可以通过添加
?
将lastName
属性设为可选。这样就可以完全省略lastName
属性的定义。 此外,undefined
的类型会自动添加到联合类型中。 因此,以下所有分配类型都是可以的:可为空类型的属性访问
如果对象的类型包括
null
或undefined
,则访问任何属性都会产生编译时错误:在访问属性之前,需要使用类型保护来检查给定对象上的属性访问是否安全:
TypeScript 是兼容 JS ,并支持条件表达式中的类型保护,所以这种方法也可以:
使用可空类型的函数调用
如果试图调用包含
null
或undefined
类型的函数,则会产生编译时错误。下面的callback
参数是可选的(注意?),所以它可能undefined
。因此,它不能被直接调用与在访问属性之前检查对象类似,我们首先需要检查函数是否具有非空值:
还可以用
typeof
检查返回的值总结
Non-nullable
类型是 TypeScript 类型系统的基础和有价值的补充。它们允许对哪些变量和属性可以为空进行精确构建。只有在类型保护将属性访问或函数调用确定为安全之后,才允许进行属性访问或函数调用,从而避免了许多编译时的可空性错误。代码部署后可能存在的BUG没法实时知道,事后为了解决这些BUG,花了大量的时间进行log 调试,这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。
原文:https://mariusschulz.com/blog/non-nullable-types-in-typescript
ILOVEJSJS
优惠码再便宜5
元##交流(欢迎加入群,群工作日都会发红包,互动讨论技术)
阿里云最近在做活动,低至2折,有兴趣可以看看:https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=pxuujn3r
干货系列文章汇总如下,觉得不错点个Star,欢迎 加群 互相学习。
因为篇幅的限制,今天的分享只到这里。如果大家想了解更多的内容的话,可以去扫一扫每篇文章最下面的二维码,然后关注咱们的微信公众号,了解更多的资讯和有价值的内容。
The text was updated successfully, but these errors were encountered: