TypeScript 学习之类型

布尔类型

• 类型: boolean
• 最简单的类型，值只有 true/false

let isDone: boolean = true;

数字类型

• 类型：number
• 数字都是浮点数，支持二进制、八进制、十进制、十六进制。

let decLiteral: number = 16; // 十进制
let hexLiteral: number = 0xf00d; // 十六进制
let binaryLiteral: number = 0b1010; // 二进制
let octalLiteral: number = 0o744; // 八进制

字符串

• 类型: string
• 三种表示字符串形式：双引号(")、单引号(')、模板(`)\

let name: string = "bob";

let name: string = 'Gene';

let name: string = 'Gene';
let str: string = `Hello, my name is ${name}`;

数组

• 类型: 类型[] 或 Array<类型>

let list: number[] = [1, 2, 3];

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

元组

• 类型: [string, number]
• 作用: 定义每一个数组元素的类型，元素之间的类型可以不一样。
• 定义元组同时也定义了数组的长度和每一个元素的类。

let x: [string, number];
x = ['hello', 100];
// x[2] = 12313; // 越界元素会报红，

枚举

• 类型: enum {}

• 是对 JavaScript 类型的一个补充。

• 枚举有自定义类型时

  1. 当自定义类型是number类型, 在此元素后的元素会在前一个元素的数值加 1 后的值来初始化自身。
  2. 当自定义类型不是number类型, 在此元素后的元素都必须自定义初始化, 直到遇到自定义初始化为number类型时，就会走 1. 的规则。

• 默认情况，从0开始为元素编号

enum Color {
  Red,
  Green,
  Blue,
}
let c: Color = Color.Red; // 输出 0

• 可以自定义枚举类型里的元素的值

// 部分值自定义为数字
enum Color1 {
  Red = 1,
  Green,
  Blue,
}

let c: Color = Color.Green; // 自动叠加前一个数的值

// 全部值自定义为数字
enum Color2 {
  Red = 1,
  Green = 4,
  Blue = 5,
}

let c: Color2 = Color2.Green; // 输出自定义的值
// 部分值自自定义为字符串
enum Status1 {
  Loading, // 初始化为 0
  Success = 'success',
  Error, // 报错，必须要有初始化
}
let s: Status1 = Status1.Success;
// 全部值自定义为字符串
enum Status2 {
  Loading = 'loading',
  Success = 'success',
  Error = 'error',
}
let s: Status2 = Status2.Loading;

• 当直到枚举的数值，却不知道枚举的元素名, 可以通过[]取得元素名

enum Color {
  Red = 1,
  Green = 3,
  Blue = 4,
}
let colorName: string = Color[3]; // Green

Any

• 类型: any
• 给不清楚类型的变量制定一个类型，可以使用any。可能这个变量的值是动态的，无法预料的。
• any 在编译时可以选择性地包含或移除类型检查。
• 与 Object 相似，但是Object类型的变量只允许赋值，不允许调用方法。

let notSure: any = 4; // ok
notSure.toFixed(2); // ok

let prettySure: Object = 4;
prettySure.toFixed(2); // 报错

Void

• 类型: void
• 表示没有任何类型。
• 常用于函数没有返回值
• 变量的类型为void，值只能是undefined、null

function warnUser(): void {
  console.log('函数没有返回值');
}

// 变量
let unusable: void = undefined;

Null 和 Undefined

• 类型: null 和 undefined
• 默认情况下，null和undefined是所有类型的子类型，可以把null和undefined赋值给number类型，或者赋值给其他类型。
• 在tsconfig.json开启strictNullChecks，则null和undefined只能赋值给void和他们自身。

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

Never

• 类型: never
• 表示永不存在的值得类型。
• never类型是总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型
• 变量类型是never,说明变量永不为真的类型保护所约束
• never 是任何类型的子类型，可以赋值给任何类型，然而没有类型是never的子类型或可以赋值给never类型(never自身除外)。即使any也不可以赋值给never.

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
  throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
  return error('Something failed');
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
  while (true) {}
}

Object

• 类型: object
• 表示非原始类型，除number、string、boolean、symbol、null和undefined之外的类型。
• 使用object类型，可以更好的表示如Object.create的 API

declare function create(o: object | null): void;

create({prop: 0}); // ok
create(null); // ok

create(42); // error
create('string'); // error
create(false); // error
create(undefined); // error

类型断言

• 当你知道到准确的类型，并想要显示的告诉编译器、程序中显示出来。

• 方法一: “尖括号” 表示法

let someValue: any = 'this is a string';

// 类型断言，告诉编译器someValue 是 string 类型
let strLength: number = (<string>someValue).length;

• 方法二: as 语法

let someValue: any = 'this is a string';

// 类型断言，告诉编译器someValue 是 string 类型
let strLength: number = (someValue as string).length;

两种方法都是等价的，在Typescript中使用jsx，只能用as语法