关于前端:现代TypeScript高级教程类型

类型

TypeScript 提供了 JavaScript 的所有根本数据类型，如：number、string、boolean等。它还减少了额定的类型，比方 any、unknown、never、void 等。

number

在 TypeScript 中，所有的数字都是浮点数。这些数字的类型是number。上面是一些例子：

let decimal: number = 6; // 十进制
let hex: number = 0xf00d; // 十六进制
let binary: number = 0b1010; // 二进制
let octal: number = 0o744; // 八进制

string

string类型示意文本数据。你能够应用单引号（’）或双引号（”）定义字符串，也能够应用反引号（`）定义模板字符串：

let color: string = "blue";
color = 'red';

let fullName: string = `Bob Bobbington`;
let age: number = 37;
let sentence: string = `Hello, my name is ${fullName}. I'll be ${age + 1} years old next month.`;

boolean

boolean类型有两个值：true和false：

let isDone: boolean = false;

Array

在 TypeScript 中，数组类型有两种表达方式。一种是在元素类型前面加上 []，示意由此类型元素组成的一个数组。另一种形式是应用数组泛型，Array< 元素类型 >：

let list: number[] = [1, 2, 3];
// 或
let list: Array<number> = [1, 2, 3];

Tuple

元组类型容许示意一个已知元素数量和类型的数组，各元素的类型不用雷同。比方，你能够定义一对值别离为 string和 number 的元组：

let x: [string, number];
x = ['hello', 10]; // OK

以上是 TypeScript 的一些根本类型。在接下来的对话中，咱们能够进一步探讨其余的 TypeScript 类型，比方枚举（enum）、null、undefined、never、void以及对象类型。

Enum

Enum 是一种非凡的类型，它能够更容易地解决一组有名字的常量。在 TypeScript 中，enum 的默认起始值是 0，而后每个成员的值都会顺次减少。你也能够手动为 enum 的成员指定值：

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

// 手动指定成员的数值
enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;

Null and Undefined

在 TypeScript 中，undefined和 null 各自有本人的类型，别离是 undefined 和null。默认状况下，它们是所有类型的子类型。这意味着你能够把 null和 undefined 赋值给 number类型的变量。

然而，当你指定了 --strictNullChecks 标记，null和 undefined 只能赋值给 void 和它们各自的类型：

let u: undefined = undefined;
let n: null = null;

Any

当你不确定一个变量应该是什么类型的时候，你可能须要用到 any 类型。any类型的变量容许你对它进行任何操作，它就像是 TypeScript 类型零碎的一个逃生窗口：

let notSure: any = 4;
notSure = "maybe a string instead";
notSure = false; // okay, definitely a boolean

Unknown

unknown类型是 TypeScript 3.0 中引入的一种新类型，它是 any 类型对应的平安类型。unknown类型的变量只能被赋值给 any 类型和 unknown 类型自身：

let value: unknown;

value = true;             // OK
value = 42;               // OK
value = "Hello World";    // OK
value = [];               // OK
value = {};               // OK

Never

never类型示意的是那些永不存在的值的类型。例如，never类型是那些总是会抛出异样或者基本就不会有返回值的函数表达式或箭头函数表达式的返回值类型：

function error(message: string): never {throw new Error(message);
}

void

在 TypeScript 中，void类型用于示意没有返回值的函数的返回类型。在 JavaScript 中，当一个函数没有返回任何值时，它会隐式地返回 undefined。void 类型就是用来表白这种状况的：

function warnUser(): void {console.log("This is my warning message");
}

在这个例子中，warnUser函数没有返回任何值，所以它的返回类型是void。

须要留神的是，在 TypeScript 中，你能够申明一个 void 类型的变量，然而你只能为它赋予 undefined 和null（在非严格 null 查看模式下）：

let unusable: void = undefined;

通常状况下，咱们不会这样应用 void 类型，因为除了 undefined 和null之外，你不能将任何值赋给 void 类型的变量。

联结类型（Union Types）

TypeScript 联结类型是一种将多种类型组合到一起的形式，示意一个值能够是多种类型之一。你能够应用管道符（|）来分隔每个类型。这能够让你在不确定一个值是什么类型的时候，为它抉择多个可能的类型。

例如，假如咱们有一个函数，这个函数的参数能够是 number 类型或者 string 类型：

function display(input: string | number) {console.log(input);
}

在下面的函数中，咱们申明了 input 参数能够是 string 类型或者 number 类型。你能够传递一个 string 类型或者 number 类型的值给 display 函数，而 TypeScript 编译器不会报错：

display(1); // OK
display("Hello"); // OK

你也能够将联结类型用于变量和属性。例如：

let variable: string | number;

variable = "Hello"; // OK
variable = 1; // OK

在下面的代码中，咱们申明了 variable 能够是 string 类型或者 number 类型。而后咱们能够平安地将一个字符串或者数字赋值给variable。

联结类型在 TypeScript 中十分罕用，因为它们能够帮忙你编写更灵便的代码。

穿插类型（Intersection Types）

穿插类型是将多个类型合并为一个类型。这让咱们能够把现有的多种类型叠加到一起取得所需的能力。它被定义为 Type1 & Type2 & Type3 & ... & TypeN。它蕴含了所需的所有类型的成员。

interface Part1 {a: string;}

interface Part2 {b: number;}

type Combined = Part1 & Part2;

let obj: Combined = { 
  a: 'hello',
  b: 42,
};

类型别名（Type Aliases）

类型别名是给一个类型起个新名字。类型别名有时和接口很类似，但能够作用于原始值，联结类型，穿插类型等任何咱们须要手写的中央。

type MyBool = true | false;
type StringOrNumber = string | number;

字符串字面量类型（String Literal Types）

字符串字面量类型容许你指定字符串必须的固定值。在实践中，这种类型常与联结类型、类型别名和类型爱护联合应用。

type Easing = "ease-in" | "ease-out" | "ease-in-out";

class UIElement {animate(dx: number, dy: number, easing: Easing) {// ...}
}

let button = new UIElement();
button.animate(0, 0, "ease-in"); // OK
button.animate(0, 0, "uneasy");  // Error: "uneasy" is not allowed here