加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

一文学懂TypeScript的类型

发布时间:2019-03-22 00:48:37 所属栏目:建站 来源:疯狂的技术宅
导读:你将学到什么 阅读本文后,你应该能够理解以下代码的含义: interfaceArrayT{ concat(...items:ArrayT[]|T):T[]; reduceU( callback:(state:U,element:T,index:number,array:T[])=U, firstState?:U):U; } 如果你认为这段代码非常神秘 那么我同意你的意见。

在JavaScript中,有时候变量会是有几种类型之中的一种。要描述这些变量,可以使用 union types。例如,在下面的代码中,x 是 null 类型或 number 类型:

  1. let x = null;  
  2. x = 123; 

x 的类型可以描述为 null | number:

  1. let x: null|number = null;  
  2. x = 123; 

类型表达式 s | t 的结果是类型 s 和 t 在集合理论意义上的联合(正如我们之前看到的那样,两个集合)。

下面让我们重写函数 stringify123():这次我们不希望参数 callback 是可选的。应该总是调用它。如果调用者不想传入一个函数,则必须显式传递 null。实现如下。

  1. function stringify123(  
  2.   callback: null | ((num: number) => string)) {  
  3.   const num = 123;  
  4.   if (callback) { // (A)  
  5.     return callback(123); // (B)  
  6.   }  
  7.   return String(num);  

请注意,在行 B 进行函数调用之前,我们必须再次检查 callback 是否真的是一个函数(行A)。如果没有检查,TypeScript 将会报告错误。

Optional 与 undefined|T

类型为 T 的可选参数和类型为 undefined|T 的参数非常相似。 (另外对于可选属性也是如此。)

主要区别在于你可以省略可选参数:

  1. function f1(x?: number) { }  
  2. f1(); // OK  
  3. f1(undefined); // OK  
  4. f1(123); // OK 

But you can’t omit parameters of type

但是你不能省略 undefined|T 类型的参数:

  1. function f2(x: undefined | number) { }  
  2. f2(); // error  
  3. f2(undefined); // OK  
  4. f2(123); // OK 

值 null 和 undefined 通常不包含在类型中

在许多编程语言中,null 是所有类型的一部分。例如只要 Java 中的参数类型为 String,就可以传递 null 而Java 不会报错。

相反,在TypeScript中,undefined 和 null 由单独的不相交类型处理。如果你想使它们生效,必须要有一个类型联合,如 undefined|string 和 null|string。

对象

与Arrays类似,对象在 JavaScript 中扮演两个角色(偶尔混合和/或更加动态):

  •  记录:在开发时已知的固定数量的属性。每个属性可以有不同的类型。
  •  字典:在开发时名称未知的任意数量的属性。所有属性键(字符串和/或符号)都具有相同的类型,属性值也是如此。

我们将在本文章中忽略 object-as-dictionaries。顺便说一句,无论如何,map 通常是比字典的更好选择。

通过接口描述 objects-as-records

接口描述 objects-as-records 。例如:

  1. interface Point {  
  2.   x: number;  
  3.   y: number;  

TypeScript 类型系统的一大优势在于它的结构上,而不是在命名上。也就是说,接口 Point 能够匹配适当结构的所有对象:

  1. function pointToString(p: Point) {  
  2.   return `(${p.x}, ${p.y})`;  
  3. }  
  4. pointToString({x: 5, y: 7}); // '(5, 7)' 

相比之下,Java 的标称类型系统需要类来实现接口。

可选属性

如果可以省略属性,则在其名称后面加上一个问号:

  1. interface Person {  
  2.   name: string;  
  3.   company?: string;  

方法

接口内还可以包含方法:

  1. interface Point {  
  2.   x: number;  
  3.   y: number;  
  4.   distance(other: Point): number;  

类型变量和泛型类型

使用静态类型,可以有两个级别:

  •  值存在于对象级别。
  •  类型存在于元级别。

同理:

  •  普通变量定义在对象级别之上。
  •  类型变量存在于元级别之上。它们是值为类型的变量。

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读