【第45篇】Typescript 中的断言函数

Typescript 3.9 在类型系统中实现了对断言函数的支持。断言函数是指当异常发生的时候会抛出错误的函数。通过使用断言签名,我们可以告诉 Typescript 某个函数应该被当做断言函数。 一个例子:document.getElementById() 方法 让我们来看一个…
2022-02-19

【第44篇】Typescript 中的 ?. 可选链操作符

Typescript 3.7 增加了对 ?. 操作符的支持,也被称为可选链操作符。我们可以使用可选链链式地访问一个对象上可能为 null 或 undefined 的属性,并且不用检查中间的属性是否为空。 可选链不是 Typescript 中特定的语法。?. 操作符已经作为 ES…
2021-07-04

【第43篇】Typescript 中的 ?? 空值合并运算符

Typescript 3.7 中增加了对 ?? 运算符的支持,它被称为空值合并运算符(nullish coalescing operator)。我们可以使用这个操作符来给可能是 null 或者 undefined 的值提供一个备用值(fallback)。 Javascript …
2021-06-27

【第42篇】Typescript 中的 Omit 帮助类型

在 3.5 版本中, Typescript 增加了 Omit<T, K> 帮助类型,作为 lib.es5.d.ts 类型定义文件的一部分和 Typescript 编译器一起发布。Omit<T, K> 允许我们通过从一个对象中删除特定的属性来创建一个新的对象类型。 Omit<T,…
2021-06-20

【第41篇】Typescript 中字面量表达式的 Const 断言

Typescript 3.4 中新增了 const 断言。const 断言是一种特殊的类型断言,它使用了 const 关键字而不是具体的类型名称。在这篇文章中,我会解释 const 断言是如何工作的,以及我们为什么需要使用它。 const 断言的产生缘由 假设我们写了下面的 f…
2021-06-13

【第40篇】Typescript 中的只读数组和元组类型

Typescript 3.4 增加了一些语法糖使得处理只读的数组和元组类型更容易。我们现在可以使用 readonly 修饰符来创建只读的数组类型(比如 readonly string[]),或只读的元组类型(比如 readonly [number, number])。 Type…
2021-06-06

【第39篇】Typescript 中的 --showConfig 编译器选项

TypeScript 3.2 给 tsc 添加了新的 --showConfig 编译选项。tsc --showConfig 命令会计算有效的 tsconfig.json 文件内容,并且将它们打印到终端中。这对于调试项目配置是很有用的,尤其是我们在 tsconfig.json 文…
2021-05-30

【第38篇】Typescript 中的 unknown 类型

Typescript 3.0 引入了一个新的 unknown 类型,它是 any 类型的对应类型,且是类型安全的。 unkonwn 类型和 any 类型最主要的区别是,unkonw 类型的使用没有 any 那么宽松。对于 unknown 类型的值,我们在对它做大部分操作之前都需…
2021-05-23

【第37篇】Typescript 中导入 JSON 模块

Typescript 2.9 引入了一个新的 --resolveJsonModule 编译器选项,允许我们在 Typescript 中导入 JSON 模块。 通过 require 导入 JSON 模块 假设我们有个用 Typescript 写的 Node 应用,需要导入下面的 …
2021-05-16

【第36篇】Typescript 中给 JSX 元素传递泛型

Typescript 2.9 支持给 JSX 元素设置泛型类型参数。这意味着我们可以像下面这样在 TSX 文件中写组件: 为了理解为什么泛型 JSX 元素是有用的(以及为什么我们通常并不需要显式地把类型参数写出来),我们先来写一个 Select 组件,然后围绕这个组件迭代升级它…
2021-05-09

【第35篇】Typescript 中的映射类型修饰符

在2016年12月 Typescript 2.1 的时候,映射类型被添加到了这门语言中。作为 Typescript 2.8 的一部分,映射类型增加了给属性添加或删除特定修饰符的能力。在这之前,我们只能给属性添加修饰符,而不能移除它们。 ? 属性修饰符 你可以在一个对象类型声明的…
2021-05-02

【第34篇】Typescript 中的条件类型

Typescript 2.8 引入了条件类型,它是类型系统强有力的补充。条件类型允许我们表达更灵活的类型映射,也就是,类型转换会根据不同的条件而不同。 介绍条件类型 条件类型会先测试一种类型关系,并基于测试结果,选择两种可能类型中的一种。它永远有以下的形式: 条件类型使用了熟悉…
2021-04-25

【第33篇】Typescript 中基于文件设置JSX工厂函数

Typescript 2.8 允许你基于单个文件来设置特定的 JSX 工厂函数名字。在这之前,你只能通过 --jsxFactory 编译选项来设置 JSX 工厂函数。并且这个设置会应用到整个项目中的所有 JSX 文件。现在,你可以通过在文件的开头添加特殊的 @jsx 注释来覆盖…
2021-04-18

【第32篇】Typescript 中的严格属性初始化

Typescript 2.7 中引入了一个新的编译选项用来对类的属性初始化做严格检查。如果 --strictPropertyInitialization 选项被开启,类型检查会验证类中的每一个实例属性是否满足以下三个条件之一: 类型中包括了 undefined 类型, 有一个明…
2021-04-11

【第31篇】Typescript 中的数字分隔符

Typescript 2.7 支持了数字分隔符,具体内容在 Numberic Separators 这个 ECMAScript 提案中有陈述。有了这个特性,你可以在数字字面量中添加下划线作为分隔符来分组数字: 分隔符不会改变数字字面量的值,但是通过这种逻辑分组可以帮助人们更快地…
2021-04-04

【第30篇】Typescript 中的 JSX Fragment 语法

TypeScript 2.6 添加了对 JSX fragments 的支持。在 .tsx 文件中,你现在可以使用新的 <>...</> 语法来创建一个 fragment。 JSX Fragments 背后的动机 在 React 中,从一个组件中返回多个元素是常见的模式。举个例子…
2021-03-28

【第29篇】Typescript 中的 Optional catch Binding

Typescript 2.5 实现了 optional catch binding 提案,该提案修改了 ECMAScript 语法,允许 catch 从句可以没有绑定的错误变量。也就是,你现在可以忽略这个错误变量以及包裹它的圆括号: 在此之前,你必须声明这个变量即便你根本用不…
2021-03-21

【第28篇】Typescript 中的动态 import() 表达式

Typescript 2.4 添加了对动态 import() 表达式的支持,它允许按需异步加载和执行 ECMAScript 模块。 在 2018 年一月的写作当下,TC39 官方的动态 import() 表达式提议处在 TC39 提议流程的阶段3(stage 3),这意味着它很…
2021-03-14

【第27篇】Typescript 中的拼写更正

Typescript 2.4 实现了标识符拼写更正机制。即便你只是稍微拼写错了变量、属性,或者函数名,Typescript 也会尽可能地给出正确的拼写建议。 拼写更正实际案例 你想调用 window.location.reload()来重载应用的当前页面,但你不小心打了loca…
2021-03-07

【第26篇】Typescript 中的弱类型检测

Typescript 2.4 引入了弱类型(weak types)的概念。当一个类型的所有属性都是可选的时候 ,它被认为是弱类型。说得更具体一些,一个弱类型定义了一个或多个可选属性,没有必需属性,也没有索引签名。 举个例子,下面的类型被认为是弱类型: 弱类型检测的主要目的是为了…
2021-02-28

【第25篇】Typescript 中的字符串枚举

Typescript 2.4 实现了一个呼声很高的特性:字符串枚举,或者更准确地说,成员的值是 string 类型的枚举。 现在允许将一个字符串赋值给一个枚举成员: 字符串枚举可以像其他 Typescript 中的枚举一样被使用: 下面是编译器生成的 ES3/ES5 代码: 输…
2021-02-21

【第24篇】Typescript 中针对 ES3/ES5 的迭代降级

Typescript 2.3 引入了一个新的 --downlevelIteration 选项,支持将 ES2015 的迭代协议(iteration protocol)编译为 ES3 和 ES5 代码。for...of 循环现在能够被降级编译为带有正确语义的代码。 使用 for.…
2021-02-14

【第23篇】Typescript 中使用 --checkJs 检查 Javascript 文件

一直到 Typescript 2.2,类型检查以及相应的错误提示仅限于 .ts 文件。从 Typescript 2.3 开始,编译器可以对普通的.js文件进行类型检查和报错。 我们可以通过设置新增的 --checkJs 标识来默认开启对所有 .js 文件的类型检查。除此之外,还…
2021-02-07

【第22篇】Typescript 中的 --strict 编译选项

Typescript 2.3 引入了一个新的 --strict 编译选项,它会开启一些相关的其他编译选项来使用更严格的类型检查。 严格类型检查选项 添加这个选项的初衷是让你可以方便地使用“默认严格模式”(strict-by-default mode)来得到更好的类型安全而不用一…
2021-02-01

【第21篇】Typescript 中的泛型参数默认值

Typescript 2.3 实现了泛型参数默认值,它允许你给泛型的参数类型设置默认类型。 在这篇文章中,我会通过将下面的 React 组件从 Javascript(即 JSX) 转成 Typescript(即 TSX) 来展开我们如何能够从泛型参数默认值中获益: 不用担心,你…
2021-01-25

【第20篇】Typescript 中的 Mixin 类

Typescript 致力于支持在不同框架和库中使用的 Javascript 通用模式(common pattterns)。从 Typescript 2.2 开始,mixin 类就是其中一种得到静态类型检查支持的模式。这篇文章会先简单介绍 mixin 是什么,然后通过一些例子来…
2021-01-18

【第19篇】Typescript 中表达式操作数的空检查

Typescript 2.2 中,空检查(null checking)又得到了改善。Typescript 现在会识别操作数可能为空的表达式,并报编译时错误。 当遇到以下的情况,Typescript 会将可能为空的表达式操作数标记为错误。内容引用自发布记录: 如果 + 操作符任意…
2021-01-11

【第18篇】Typescript 中的点操作符属性和字符串索引签名

在 Typescript 2.2 之前,你如果想访问一个包含字符串索引签名类型上的任意属性,你必须使用 [] 的方式,而不能使用 . 操作符: Typescript 2.2 移除了这个限制。现在你既可以用点操作符也可以用方括号的形式来访问属性,编译器不会再对你咆哮了。在很多场景…
2021-01-04

【第17篇】Typescript 中的 object 类型

Typescript 2.2 引入了一个新类型叫 object。它代表了任意的非原始类型。下面的这些类型在 Javascript 中被认为是原始类型: string boolean number bigint symbol null undefined 其他所有的类型都被认为是…
2020-12-28

【第16篇】Typescript 中没有类型的导入

Typscript 2.1 使得导入不具类型的模块更容易。之前,编译器过于严格,所以当你导入一个没有类型声明的模块的时候会提示错误: 从 Typescript 2.1 开始,对于这种情况编译器不会再报错。Typescript 允许导入没有类型的模块,编辑器也不会在导入的模块下…
2020-12-21

【第15篇】Typescript 中的字面量类型拓宽

在我上一篇谈 Typesript 2.1 更好的类型推断的文章中,我解释了 Typescript 如何将初始化了字面量值的 const 变量和 readyonly 属性推断为字面量类型。在这篇文章中,我会继续讨论并区分拓宽和非拓宽的字面量类型。 拓宽的字面量类型 当你用 con…
2020-12-14

【第14篇】Typescript 中增强的字面量类型推断

Typescript 中很早就存在字符串字面量类型。到 2.0 的时候,类型系统又新增了一些新的字面量类型: 布尔字面量类型 数字字面量类型 枚举字面量类型 在 TypeScript 2.1 中,如果一个变量用 const 声明或者一个属性用 readonly 声明,并且有一个…
2020-12-07

【第13篇】Typescript 中的映射类型

Typescript 2.1 引入了映射类型(mapped types),这给类型系统添加了强大的武器。简单说,映射类型允许你通过映射已有类型的每个属性来创建新的类型。已有类型的每个属性会根据你设置的规则进行转换。转换后的属性会构造出一个新的类型。 使用映射类型,你就能捕获一些…
2020-11-30

【第12篇】Typescript 中的 keyof 和类型查询

Javascript 是高度动态的语言。所以想要在一个静态类型系统中捕获某些操作的语义并不是件容易的事。比如下面的 prop 函数: 它接受一个对象和一个 key 作为入参,然后返回对应的属性的值。对象中不同属性的值可能有完全不同的类型,并且,我们甚至不知道 obj 的类型是怎…
2020-11-23

【第11篇】Typescript 中的对象剩余和扩展属性

Typescript 2.1 实现了在 ES2018 中标准化的对象剩余和扩展属性(Object Rest And Spread Properties)。所以你可以以类型安全的方式使用剩余和扩展属性,编译器最终会将这两个特性降级为 ES3 代码。 对象剩余属性 假设你声明了一个…
2020-11-16

【第10篇】Typescript 中的外置帮助函数

在某些情况下,Typescript 编译器会在生成的代码中注入一些运行时执行的帮助函数。每个帮助函数都模拟了一个语言特性,这些特性在构建目标语言版本(ES3, ES5, ES2015, …)中没有得到原生支持。 目前,Typescript 中存在以下的一些帮助函数: __ext…
2020-11-09

【第9篇】Typescript 如何将 async/await 编译成 ES3/ES5

早在2015年11月的时候,Typescript 在 1.7 的版本就已经支持 async/await 关键字了。编译器会把异步函数转换成 generator 函数。然而,这也意味着编译后的代码不能运行在只支持 ES3或ES5 的环境中,因为 generator 是 ES201…
2020-11-02

【第8篇】Typescript 中的内置类型声明

Typescript 2.0 让你能够更细粒度地控制哪些内置的 API 声明可以被加入到项目中。在之前,如果你的项目的构建目标(target)是ES6,那么你只能访问 ES2015 的API。现在,内置的标准库声明已经模块化,Typescript 已经允许你选择哪些类型声明需要…
2020-10-25

【第7篇】Typescript 中的 never 类型

Typescript 2.0 中引入了一个新的原始类型 never。它代表了某种不可能发生的值的类型。never 类型通常在以下两种场景中被使用。 作为没有返回值的函数的返回类型 在类型守卫中不可能有正确类型的值的类型 下面是 never 类型具体的一些特征,详细内容见这里: …
2020-10-18

【第6篇】Typescript 中更多的字面量类型

Typescript 1.8 引入了字符串字面量类型,用于将变量的值限定在有限的字符串字面量集合中。在 Typescript 2.0 中,字面量类型不再局限于字符串字面量。以下的这些字面量类型被添加到了类型系统中: 布尔字面量类型 数字字面量类型 枚举字面量类型 下面我们就每一…
2020-10-11

【第5篇】Typescript 中的标签联合类型

译者注:tagged union types 没有比较好的中文翻译,维基百科翻译为标签联合,也称可辨识联合(discriminated union)或者变体类型(variant type)。它是一种数据结构,很像联合(C/C++程序员一定知道这个结构)。它有一个字段(或称为属性…
2020-10-04

【第4篇】Typescript 中的 Ready-Only 属性

Typescript 2.0 中增加了 readonly 修饰符。被标记为 readonly 的属性只能在初始化的时候赋值或者在同一个类的构造函数中赋值。除此之外,均不被允许。 让我们来看一个例子。这儿有个简单的 Point 类声明了两个 read-only 属性,x 和 y:…
2020-09-27

【第3篇】Typescript 中如何获取类型声明文件

本文是 Typescript Evolution 系列的第 3 篇,原作者已经更新到了 40 多篇。该系列从 Typescript 2.0 开始,对每次语言更新新增的重要特性都做了通俗易懂的介绍,等不及翻译的同学建议直接阅读系列原文。 在 Typescript 2.0 中,获取…
2020-09-20

【第2篇】Typescript 中基于控制流的类型分析

本文是 Typescript Evolution 系列的第 2 篇,原作者已经更新到了40多篇。该系列从 Typescript 2.0 开始,对每次语言更新新增的重要特性都做了通俗易懂的介绍,等不及翻译的同学建议直接阅读系列原文。 Typescript 2.0 发布带来了许多新…
2020-09-13

【第1篇】Typescript 中的 Non-Nullable类型

Typescirpt 2.0发布了许多新的特性。在这篇文章中,我们一起学习non-nulable类型。它是对类型系统的重要改进,旨在避免一整类在编译时因为可能为空值引发的报错。 null和undefined 在Typescript 2.0之前,null和undefined可以是…
2019-03-09
郑超的独立博客