TypeScript 2.8引入条件类型

转载 2018年04月15日 00:00:00

最新发布的TypeScript 2.8包含了若干主要特性和一些问题修复,其中最为重要的是新增了条件类型,开发人员可以根据其他类型的特征为变量选择适当的类型。

条件类型最适合与泛型组合在一起使用。如果一个框架总是重复相同的选择性代码,就会变得很繁琐。JavaScript可以在运行时根据具体值做出决策,与之类似,TypeScript的条件类型可以根据其他类型的特征来做出决策。

TypeScript团队给出了一个示例,使用更灵活的接口代替原先繁琐的API:

原先:

interface Id { id: number, /* other fields */ }
interface Name { name: string, /* other fields */ }

declare function createLabel(id: number): Id;
declare function createLabel(name: string): Name;
declare function createLabel(name: string | number): Id | Name;

替换为:

type IdOrName<T extends number | string> =   T extends number ? Id : Name;

declare function createLabel<T extends number | string>(idOrName: T):   T extends number ? Id : Name;

条件类型提供了infer关键字来推断类型,用于替代手动获取类型。TypeScript为此提供了一个示例,他们创建了一个叫作Flatten的类型,用于将数组转成他们需要的元素类型:

type Flatten<T> = T extends any[] ? T[number] : T;

如果使用关键字infer就可以将上面的代码简化成:

type Flatten<T> = T extends Array<infer U> ? U : T;

条件类型也为联合类型带来了改进,现在可以根据条件类型来分配联合类型。

另外,TypeScript还增加了若干新的类型别名(Exclude、Extract、InstanceType、NonNullable、ReturnType),这些类型别名也是基于条件类型的。TypeScript团队因此可以更高效地直接往语言里添加额外的类型模式。

TypeScript 2.8还增加了一个新的--emitDeclarationOnly标记,用于分离TypeScript定义文件和JavaScript文件,从而改进了使用Babel 7转换TypeScript代码的过程。

该版本还为React和JSX用户带来了一些有关编译注释和JSX模块解析的改进。

现在可以使用-operator或新的Required类型来移除标识符。

其他小改进还包括:用于清理ES模块导入的辅助工具和对未初始化类属性检查的改进。

总体来说,TypeScript 2.8带来了若干改进,大部分都是基于新引入的条件类型,现在可以定义更复杂的类型。

可以通过npm install -g typescript来安装最新的TypeScript 2.8,或者直接从GitHub上下载。TypeScript 2.9正在开发中,预计5月下旬发布。

原文地址 http://www.infoq.com/cn/news/2018/04/typescript-2-8-conditional-types


.NET社区新闻,深度好文,欢迎访问公众号文章汇总 http://www.csharpkit.com

640?wx_fmt=jpeg

Typescript或Angular中使用第三方库

Typescript或Angular中使用第三方库当我们写Typescript或Angular时,有时会使用到第三方的库,例如jQuery或Bootstrap等。以jquery为例,下面就介绍一下如何...
  • HaiJing1995
  • HaiJing1995
  • 2017-05-01 20:00:07
  • 1973

如何在TypeScript中应用像Jquery之类的第三方JavaScript框架

类型定义文件(*.d.ts) 要在TypeScript引用第三方JavaScript库和框架,首先要了解TypeScript的类型定义文件。TypeScript的类型定义文件用来帮助开发者在TypeS...
  • xiaozhi_2016
  • xiaozhi_2016
  • 2017-03-28 19:26:51
  • 7713

JS如何捆绑TypeScript声明文件

前话 TypeScript是JavaScript类型的超集 这是TypeScript的文档介绍的一句话,那么他们存在联系呢?我的理解是,TypeScript在JavaScript基础上引入强类型语...
  • pwc1996
  • pwc1996
  • 2017-09-02 19:27:45
  • 1833

TypeScript Symbols 介绍

Symbols 介绍自ECMAScript 2015起,symbol成为了一种新的原生类型,就像number和string一样。symbol类型的值是通过Symbol构造函数创建的。let sym1...
  • xiejunna
  • xiejunna
  • 2016-12-12 19:42:20
  • 1008

如何在typescript中引入javascript文件,

要把javascript文件转换成.d.ts后缀文件, 可以去这里找javascript插件转.d.ts后的文件 跳转链接 还可以npm下载typings 转换文件格式 跳转链接...
  • qq_36171431
  • qq_36171431
  • 2018-01-27 16:23:20
  • 575

【学习笔记】熟悉并使用TypeScript的命名空间namespace

在C#和ActionScript中,我们已经能看到命名空间这样的词。 详情见参考官方文档:命名空间。 这里我只说一下具体用法,和它倒底能干什么。 命名空间,简单理解,就是作用域和具体归属,...
  • sjt223857130
  • sjt223857130
  • 2017-07-29 20:35:54
  • 1196

TypeScript + React环境构建和demo

下面的示例项目可以从我的github上获取为什么用TypeScriptTypeScript为JavaScript这个弱类型语言添加了基本的类型检测以及对于ES6甚至ES7的一些高级语法的转移,在一定程...
  • cithegod
  • cithegod
  • 2017-07-27 10:17:15
  • 2802

TypeScript自动引入脚本插件

TypeScript自动引入脚本插件用TypeScript的都知道,如果项目涉及到大量的类,代码编写起来就非常蛋疼,需要手动写import {xxx} from “./xxx/xxx/xxx”。这里给...
  • u011004567
  • u011004567
  • 2017-11-11 16:32:25
  • 193

TypeScript函数类型

TypeScript函数类型1.一般函数 function add(firstName : string,lastName : string, age : number) : string{ ...
  • setsunahao
  • setsunahao
  • 2017-04-23 19:41:23
  • 1129

TypeScript 类型推论整理

一、类型推论 TypeScript里,在有些没有明确指定出类型的地方,类型推论会绑定提供类型。 1.最佳通用类型,自动给出 let x = 3; console.log(typeof x);//...
  • u011127019
  • u011127019
  • 2017-06-29 09:49:23
  • 572
收藏助手
不良信息举报
您举报文章:TypeScript 2.8引入条件类型
举报原因:
原因补充:

(最多只允许输入30个字)