关于前端:现代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;             // OKvalue = 42;               // OKvalue = "Hello World";    // OKvalue = [];               // OKvalue = {};               // 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); // OKdisplay("Hello"); // OK

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

let variable: string | number;variable = "Hello"; // OKvariable = 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"); // OKbutton.animate(0, 0, "uneasy");  // Error: "uneasy" is not allowed here