二、TypeScript的基本类型

（一）类型声明

• 通过类型声明可以指定 TS 中变量（参数、形参）的类型
• 指定类型后，当为变量赋值时，TS 编译器会自动检查值是否符合类型声明，符合则赋值，否则报错
• 类型声明给变量设置了类型，使得变量只能存储某种类型的值
• 语法：

let 变量: 类型;

let 变量: 类型 = 值;

function fn(参数: 类型, 参数: 类型): 类型 {
  // ......
}

1.先声明再赋值

// 声明一个变量a，同时指定它的类型为number
let a: number;

// a的类型设置为number，在以后的使用过程中a的值只能是数字
a = 10;
a = 33;
a = "hello"; // 报错，tsc编译时会报错，但仍能成功编译为js文件

let b: string;
b = "hello";
b = 123; // 报错

2.声明时赋值

// let c: boolean = true;

// 如果变量声明和赋值同时进行，TS可以自动对变量进行类型判断
let c = false;
c = true;
c = 123; // 报错

3.自动类型判断

• TS 拥有自动的类型判断机制
• 可用于解决 JS 中函数参数类型不一致导致的计算错误问题

// JS中的函数是不考虑参数的类型和个数的
// function sum(a, b) {
//   return a + b;
// }
// console.log(sum(123, 456)); // 579
// console.log(sum(123, "456")); // "123456"

// TS
function sum(a: number, b: number): number {
  return a + b;
  // return a + 'hello'; // 报错，返回值类型错误
}
console.log(sum(123, 456)); // 579
console.log(sum(123, "456")); // 报错，参数类型错误
console.log(sum(123, 456, 789)); // 报错，多传参
console.log(sum(123)); // 报错：少传参

（二）基本类型

类型	例子	描述
number	1, -33, 2.5	任意数字
string	'hi', "hi", hi	任意字符串
boolean	true, false	布尔值 true 或 false
字面量	其本身	限制变量的值就是该字面量的值
any	*	任意类型
unknown	*	类型安全的 any
void	空值（undefined）	没有值（或 undefined）
never	没有值	不能是任何值
object	{ name: "Alice" }	任意的 JS 对象
array	[1, 2, 3]	任意的 JS 数组
tuple	[4, 5]	元组，TS 新增类型，固定长度的数组
enum	enum{A, B}	枚举，TS 新增类型

1.字面量

// 可以声明为普通类型，但是意义不大
let a: 10;
a = 10;

// 可以使用 | 来连接多个类型（联合类型）
let b: "male" | "female";
b = "male";
b = "female";
b = "hello"; // 报错，只能取定义时给定值

let c: boolean | string;
c = true;
c = "hello";

// 使用 & 表示同时满足多个类型
let j: { name: string } & { age: number };
j = { name: "Alice" }; // 报错
j = { name: "Alice", age: 18 };

2.any

• any表示任意类型，相当于对该变量关闭 TS 的类型检测，不建议使用
• 声明变量时如果不指定类型，则 TS 解析器会自动判断变量类型为any（隐式）

let d: any; // 显式any
let d; // 隐式any
d = 10;
d = "hello";
d = true;

3.unknown

• unknown 表示未知类型的值（类型安全）
• 不确定类型时尽量用 unknown
• 类型断言语法：
  • 变量 as 类型
  • <类型>变量

let e: unknown;
e = 10;
e = "hello";
e = true;

let s: string;
s = d; // d的类型是any，可以赋值给任何变量，不安全。
e = "hello";
s = e; // 报错，e的类型unknown，不能赋值给其他类型的变量，安全。

// unknown变量赋值前应该判断类型
if (typeof e === "string") {
  s = e;
}
// 或者类型断言，告诉解析器变量的实际类型
s = e as string;
// 等价于
s = <string>e;

4.void

• void 表示空，以函数为例表示：
  • 没有返回值
  • return null;
  • return undefined;

// 未声明返回值类型的函数默认为void
function fn() {}

5.never

• never 表示永远不会返回结果
• 通常是抛出错误

function fn2(): never {
  throw new Error("报错了！");
}

6.object

• object 表示一个 JS 对象，一般开发中不直接使用
• 使用类似字面量声明方式声明对象中包含的某些属性
• 语法：
  • { 属性名: 属性值, 属性名: 属性值, ... }
  • { 属性名: 属性值, 属性名?: 属性值, ... }
  • { 属性名: 属性值, [propName: string]: any }
• 函数结构语法：
  • { 形参: 类型, 形参: 类型, ... } => 返回值类型

let a: object;
a = {};
a = function () {};

// 通常用于指定对象中可以包含哪些属性，不能多不能少，?:表示可选属性
let b: { name: string; sex?: string };
b = {}; // 报错
b = { name: "Alice" };
b = { name: "Alice", age: 19 }; // 报错
b = { name: "Alice", sex: "男" };

// [propName:string]表示任意属性名，any表示任意属性值，以此声明对象中的多个不确定属性
let c = { name: string, [propName: string]: any };
c = { name: "Tom", a: 1, b: 2 };

let d: Function; // 无意义，同object。
// 使用箭头函数设置函数结构的类型声明
let d: (a: number, b: number) => number;

7.array

• 声明特定类型的数组
• 只存储某一类型的数值
• 语法：
  • 类型[]
  • Array<类型>

// 字符串数组
let e: string[];
e = ["a", "b", "c"];

// 数值数组
let f: number[];
f = [1, 2, 3];
let g: Array<number>;
g = [1, 2, 3];

8.tuple

• tuple表示元组
• 即固定长度的数组

let h: [string, string];
h = ["hello"]; // 报错
h = ["hello", "abc"];
h = ["hello", "abc", 123]; // 报错

9.enum

• enum 表示枚举
• 即列举所有可能属性

enum Gender {
  // Male,
  // Female,
  Male = 1,
  Female = 0,
}
let i: { name: string; gender: Gender };
i = {
  name: "Alice",
  gender: Gender.Male,
};
console.log(i.gender === Gender.Female); // false

（三）类型别名

type myType = 1 | 2 | 3 | 4 | 5;
let k: 1 | 2 | 3 | 4 | 5;
let l: myType;