TypeScript 2.0开启空值的严格检查
本文分享自华为云社区《TypeScript开启严格空值检查》,作者:搞前端的半夏。
在TS中,有对应JS中的基础类型null和undefined。
TypeScript里,JS中的基本数据类型undefined和null两者各自有自己的类型分别叫做undefined和null。
let u: undefined = undefined;
let n: null = null;
默认情况下null和undefined是所有类型的子类型。 就是说你可以把null和undefined赋值给number类型的变量。
例如下面的代码,在TS中是完全可以执行的。
let userName: string;
userName = "搞前端的半夏"; // OK
userName = null; // OK
userName = undefined; // OKlet age: number;
age = 18; // OK
age = null; // OK
age = undefined; // OKlet isBoy: boolean;
isBoy = true; // OK
isBoy = false; // OK
isBoy = null; // OK
isBoy = undefined; // OK
在编程过程成空指针是最常见的bug之一,但是在TypeScript中我们无法使用具体的类型来表示特定的变量不能为空!幸运的是,TypeScript 2.0 解决了这个问题!。
strictNullChecks
TypeScript 2.0 增加了对不可为空类型的支持。有一种新的严格空值检查模式,他提供了strictNullChecks
来限制对空值的检查。可以通过在命令行上添加--strictNullChecks参数来启功严格空值检查。也可以在项目的tsconfig.json文件中启用strictNullChecks编译器选项。
在TS中,为了各版本的兼容,strictNullChecks的默认值是false
{"compilerOptions": {"strictNullChecks": true// ...}
}
在TS官方的演练场中你可以勾选strictNullChecks来启用严格空值检查!
注意点1
在严格空值检查模式下,null和undefined无法赋值给其他类型的变量。
例如下面的代码在*strictNullChecks=true下,是无法编译通过的。
let userName: string;
userName = "搞前端的半夏"; // OK
userName = null; // OK
userName = undefined; // OK
注意点2
严格空值检查并不意味着变量的类型无法设置为null和undefined
例如下面的代码在*strictNullChecks=true下,正常编译通过的。
let userName: null;
userName = null; let age: undefined;
age = undefined;
变量如何可以为空
在正常的编程中,我们并不会直接将一个变量的类型设置为null或者undefined,例如username,我们通常设置为string类型。
如果我们想要username可以接受空值我们该怎么办呢?
1. 使用联合类型
联合类型(Union Types)表示取值可以为多种类型中的一种。
对于下面的代码,userName可以接受null类型的值。但是无法接受undefined的值
let userName: string | null;
userName = "搞前端的半夏"; // OK
userName = null; // OK
userName = undefined; // Error
2. a? 默认undefined
联合类型可以在Object中使用
type User = {name: string ;age:number | undefined
};
这里我们设置age的类型为number和undefined。
下面的两种用法都是正确的。
let user1: User = { name: "搞前端的半夏", age: undefined };
let user2: User = { name: "搞前端的半夏", age: 18 };
如果我们想要下面的效果,不需要手动给age赋值
let user2: User = { name: "搞前端的半夏"};
此时我们就需要用到**?**来使属性成为可选,这样我们就可以完全省略age属性的定义。
type User = {name: string ;age?:number
};
请注意,在这种情况下:undefined类型会自动添加到联合类型中。因此,以下所有赋值都是正确的:
let user1: User = { name: "搞前端的半夏", age: undefined };
let user2: User = { name: "搞前端的半夏", age: 18 };
let user3: User = { name: "搞前端的半夏"};
安全检查
变量可空的安全检查
如果变量的类型包含nullor undefined,则访问任何属性都会产生编译时错误:
function UserNameLength(userName: string | null) {return userName.length;
}
所以在访问属性之前,必须要先判断变量的值是否为空!
function UserNameLength(userName: string | null) {if (userName === null) {return 0;}return userName.length;
}
#可空类型的函数调用
在JS中支持回调函数,所以函数的参数会可能是函数类型,
function fn(callback?: () => void) {callback();
}
如果该参数是可选的函数类型,TS会将该参数加上undefined类型。
那么这个函数的我们在调用函数的时候会报错!
类似于在访问属性之前检查对象,我们需要首先检查函数是否具有非空值:
function fn(callback?: () => void) {if (callback) {callback();}
}
点击关注,第一时间了解华为云新鲜技术~
TypeScript 2.0开启空值的严格检查相关推荐
- TypeScript 4.0 发布
喜欢就关注我们吧! 整体看来,此版本在兼容性方面没有特别大的变化.因为 TypeScript 团队表示新版本继续使用与过去版本相似的版本控制模型,可将 4.0 视作 3.9 的延续升级版本. 而且他们 ...
- TypeScript 2.0 已发布
微软最近发布了TypeScript 2.0,该版本提供了简化的声明文件获取.Non-nullable类型,以及Readonly修饰符. TypeScript项目经理Daniel Rosenwasser ...
- TypeScript 3.0下react默认属性DefaultProps解决方案
TypeScript 3.0下react默认属性DefaultProps解决方案 参考文章: (1)TypeScript 3.0下react默认属性DefaultProps解决方案 (2)https: ...
- TypeScript 3.0 新功能介绍(二)
2019独角兽企业重金招聘Python工程师标准>>> 转载 TypeScript 3.0 新功能介绍(二) TypeScript 3.0 新功能介绍(二) New unknown ...
- Dubbo 3.0 - 开启下一代云原生微服务
作者 | 郭浩(项升) 阿里巴巴经济体 RPC 框架负责人 **导读:**本文整理自作者于 2020 年云原生微服务大会上的分享<Dubbo3.0 - 开启下一代云原生微服务>,主要介绍 ...
- 〔译〕TypeScript 2.0 正式发布
译者注:可能大家更关心的是 [译]TypeScript 2.0 的新特性 [原文] TypeScript 2.0 is now available! September 22, 2016 by Dan ...
- 〔译〕TypeScript 2.0 候选版发布
相关链接 TypeScript 2.0 正式版已经发布了:[译]TypeScript 2.0 正式版发布 不过可能大家更关心的是 [译]TypeScript 2.0 的新特性 原文:Announcin ...
- Android studio3.0开启抓包功能打包会使apk体积增大好几倍
Android studio3.0开启抓包功能打包会使apk体积增大好几倍 Android studio3.0开启抓包功能打包会使apk体积增大好几倍: 今天尝试了下AS3.0抓包功能,还没怎么整明白 ...
- TypeScript 2.0 正式发布
9 月 22 日,TypeScript 2.0 正式发布了. TypeScript 是微软开发的开源的编程语言,主要负责人是 C# 之父 Anders Hejlsberg. TypeScript 成功 ...
最新文章
- ARP协议SMTP协议MIME
- linux python3 pip3_linux环境下安装python3以及pip3
- PHP面向对象的进阶学习
- 回溯法(其实是递归)
- android 通话结束广播,在Android中以编程方式结束通话
- 【2017年第1期】基于征信数据观中国近10年产业间信贷资源的调整路径
- log4j+mybatis打印日志文件
- 腾讯财报:微信月活增至10.98亿 QQ月活8.07亿
- mysql不能删除外键吗,为什么mysql不允许删除外键?
- [WildPackets.OmniPeek].OmniPeek.4.0.1
- docker导入导出
- redis集群工具redis-trib制作并打包上传到私有Harbor
- Fluent中级工程进阶,从5种气体燃烧模型出发
- 由batch 命令setlocal enabledelayedexpansion引发的
- 中职计算机专业英语说课稿,中职英语基础模块说课
- 水水水水水水水水水水水水水水水水水水水
- android 分享带图片的信息到彩信,微薄====
- 第一周python学习
- SSL peer shut down incorrectly报错解决
- 在windows上用vscode打造比vc++6.0好用的C/C++ IDE,适用编程小白