TypeScript 基础 — Null 和 Undefined

2023-11-14

nullundefined 都有各自的类型名称。这些类型本身没有用处,因为我们只能将 nullundefined 赋值给定义为 nullundefined 类型的变量。

let u: undefined = undefined
u = 'string' // compile error

let n: null = null
n = 43 //compile error

默认情况下,nullundefined 是所有类型的子类型。 就是说可以把 nullundefined 赋值给 number 类型的变量。

let value: string | undefined | null = null
value = 'hello'
value = undefined

注意:默认情况下,将禁用 nullundefined 处理,我们可以通过在 tsconfig.json 文件将 strictNullChecks 设置为 true 来启用。当启用 strictNullChecks 时,本文的示例才能正常运行。

可选链

可选链接是一种 JavaScript 功能,它与 TypeScript 的空处理配合得很好。它允许使用紧凑的语法访问对象上的属性,这些属性可能存在,也可能不存在。它可以和 ?.(可选链)运算符访在问属性时一起使用。

interface User {
  name: string
  address?: {
    street: string
  }
}

function printStreet(user: User) {
  const streetInfo = user.address?.street
  if (streetInfo === undefined) {
    console.log('No street info')
  } else {
    console.log(streetInfo)
  }
}

let user: User = {
  name: 'O.O'
}

printStreet(user) // 'No street info'

空值合并

空值合并是另一个 JavaScript 特性,它也可以很好地与 TypeScript 的空处理配合使用。

它允许编写在处理 nullundefined 时有回退的表达式。当表达式中可能出现其他 falsy 值,但这些值仍然有效时,这非常有用。

它可以与表达式中的 ??(空值合并运算符)一起使用,类似于使用 &&(与运算符)

function printName(name: string | null | undefined) {
  console.log(`${name ?? '无名氏'}`)
}

printName(null) // '无名氏'
printName('O.O') // 'O.O'

空断言

TypeScript 的推理系统并不完美,有时候忽略一个值为 nullundefined 的可能性是有意义的。一个简单的方法就是使用类型转换,但是 TypeScript 也提供了 ! 运算符作为方便的快捷方式。

function getValue(): string | undefined {
  return 'hello'
}

let value = getValue()

value.length // value 可能为 undefined
// 使用 ! 运算符
value!.length // 5

就像类型转化一样,这可能是不安全的,应该小心使用。

数组边界处理

即使启用了 strictNullChecks,默认情况下 TypeScript 也会假定数组访问永远不会返回 undefined(除非 undefined 是数组类型的一部分)。

let array: number[] = [1, 2, 3]
let value = array[0] // value 的类型为 number

我们可以配置 noUncheckedIndexedAccess 来更改此行为。

let array: number[] = [1, 2, 3]
let value = array[0] // value 的类型为 number | undefined
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

TypeScript 基础 — Null 和 Undefined 的相关文章

随机推荐

  • Python爬虫之Js逆向案例(3)-X品牌手机社区

    声明 XX手机社区加密逆向分析仅用于研究和学习 这篇文章的学习内容是以XX手机社区为案例 对JS逆向的整个过程进行详细分析 下面会进行以下几步进行分析 下方演示过程全部使用chrome浏览器 锁定关键接口 锁定关键字段 破解关键字段 pyt
  • (Java)leetcode-4 Median of Two Sorted Arrays(寻找两个正序数组的中位数)

    题目描述 给定两个大小为 m 和 n 的正序 从小到大 数组 nums1 和 nums2 请你找出这两个正序数组的中位数 并且要求算法的时间复杂度为 O log m n 你可以假设 nums1 和 nums2 不会同时为空 示例 1 num
  • 三步实现Android任意控件悬浮效果

    Tag 项目介绍 之前做项目的时候实现的一个悬浮效果 如图 可能不够清晰 接下来就是实现效果 如图所示 demo直接用的截图 原理很简单 用RecyclerView addHeaderView的方式实现 实现步骤 1 添加依赖 compil
  • 树莓派——linux内核与驱动

    文章目录 Linux内核基础框架 内核结构框图 linux系统架构 shell 驱动 为什么要学习写驱动 什么是驱动 硬件设备分类 文件名与设备号 驱动结构框图的认知 内核的 sys open sys read 会做什么 驱动程序开发步骤
  • 过采样和欠采样

    一 采样定理 只要采样频率高于信号最高频率的两倍 就可以从采样信号中恢复出原始信号 二 过采样和欠采样 1 采样频率高于信号最高频率的两倍 这种采样被称为过采样 2 采样频率低于信号最高频率的两倍 这种采样被称为欠采样 三 基带信号和频带信
  • 计算机网络知识点汇总

    主要内容 基本概念 物理层 数据链路层 网络层 传输层 应用层 一 基本概念 计算机网络 按照某种协议进行数据通信 实现硬件资源和软件资源的共享 分类 分布范围 使用者 交换技术 拓扑结构 传输技术 计算机网络的体系结构 ISO OSI参考
  • @RequestParam、@PathVariable、@RequestBody、@ResponseBody注解辨析

    RequestParam RequestParam 将请求参数绑定到你控制器的方法参数上 是springmvc中接收普通参数的注解 例如 defaultValue为给name设定默认值 RequestParam中的value值必须跟http
  • UML笔记

    UML笔记 枫叶云笔记
  • GLSL-TBN矩阵

    TBN矩阵 一 简述 1 1 TBN矩阵作用 我们研究一个矩阵的时候通常需要了解一个矩阵是从哪一个空间或者说矩阵而来的 如果搜索一下TBN矩阵运算公式可以发现其决定于物体坐标系下的顶点和纹理坐标系下的纹理坐标 想到这里我们需要明确TBN运算
  • 数据库服务版本升级

    数据库版本升级方法 第一种方法 本地升级 数据库服务5 6 5 7 8 0 停库 第二种方法 迁移升级 数据库服务数据迁移到另一台新的数据库服务中 旧版数据库服务地址 10 0 0 51 网络停止 新版数据库服务地址 10 0 0 51 8
  • AR回归模型详解

    转 http geodesy blog sohu com 273714573 html 1 自回归模型的定义 自回归模型 Autoregressive Model 是用自身做回归变量的过程 即利用前期若干时刻的随机变量的线性组合来描述以后某
  • JavaJDK实现无钥签名根证书与沙箱安全机制

    1 起因 接到项目经理的需求 项目有涉及文件的上传 需要把上传的文件进行数字签名 简称无钥签名 然后对签名后的文件进行无钥验证 对于从来没有听过无钥签名的我感觉很懵 后面就去上网查数字签名是java的哪一块 得到以下结果 Java里其实有两
  • 9.1 Linux配置网络服务

    9 1 1 配置网络参数 9 1 2 创建网络会话 9 1 3 绑定两块网卡 第1步 第2步 第3步 第4步 9 1 1 配置网络参数 在 Linux 系统上配置服务 在此之前 必须先保证主机之间能够顺畅地通信 如果网络不通 即便服务部署得
  • 朱嘉明:区块链成为经济转型、形成产业新业态的技术手段

    文章来自巴比特https www 8btc com live 14 在港珠澳大桥开通 以及粤港澳大湾区规划发展的效应下 珠海和澳门的城市发展进入到一个里程碑式的协同新阶段 尤其是拥有中央战略定位加持的国家级新区 横琴 早已吹响创新发展的号角
  • 第二章:恶意软件动态分析基础

    文章目录 前言 动态分析的局限 前言 静态分析侧重的是恶意软件在文件形式中的表现 动态分析则在一个安全 受控的环境中运行恶意软件以查看其行为方式 通过动态分析 我们可以绕过常见的静态分析障碍 例如加壳 混淆 以更直观地了解给定恶意软件样本的
  • Java 中数据结构LinkedList的用法

    LinkList 链表 Linked list 是一种常见的基础数据结构 是一种线性表 但是并不会按线性的顺序存储数据 而是在每一个节点里存到下一个节点的地址 链表可分为单向链表和双向链表 一个单向链表包含两个值 当前节点的值和一个指向下一
  • IDEA创建父项目和子项目

    一 创建父项目 1 首先在IDEA中使用Spring Initializr的方式创建一个Springboot的工程 点击File gt New gt Project gt Spring Initializr gt Next 2 Projec
  • 首期 OSCHINA 季度软件评选活动正式开启,快来投票吧!

    gt https www oschina net project 2020 q1 project 上周我们发出了 OSCHINA 开源软件趋势榜 即将上线的通知 并收到不少软件推荐 首先要感谢大家的热情参与 若有对此还不了解的朋友 OSCH
  • CSS 滑动门

    先来体会下现实中的滑动门 或者你可以叫做推拉门 滑动门出现的背景 制作网页时 为了美观 常常需要为网页元素设置特殊形状的背景 比如微信导航栏 有凸起和凹下去的感觉 最大的问题是里面的字数不一样多 咋办 为了使各种特殊形状的背景能够自适应元素
  • TypeScript 基础 — Null 和 Undefined

    null 和 undefined 都有各自的类型名称 这些类型本身没有用处 因为我们只能将 null 和 undefined 赋值给定义为 null 或 undefined 类型的变量 let u undefined undefined u