以下只列举了部分类型,待更新中。。。
更新时间:2021 年 8 月 26 日 17:47:24

# 元组

  • 概念:就是一个规定了元素数量和每个元素类型的 “数组”,而每个元素的类型,可以不相同
  • 语法:
//let 元组名: [类型 1, 类型 2, 类型 3] = [值 1, 值 2, 值 3];
let tup1: [string, number, boolean] = ['哈哈~~', 18, true];

# 枚举

  • 问题:性别标识

image-20210412165525442

  • 声明语法
//	enum 枚举名 {
//    	枚举项 1 = 枚举值 1,
//    	枚举项 2 = 枚举值 2,
//   	...
//	}
// 声明性别枚举
enum Gender {
  Boy = 1,
  Girl = 2,
  Unknown = 3
}
// 枚举项一般用英文和数字,而枚举值用整形数字
// 创建 用户性别变量
let usrSex: Gender = Gender.Boy;
// 判断 变量中的性别是否为 Boy
if (usrSex == Gender.Boy) {
  console.log(usrSex); // 1
} else {
  console.log(usrSex); // 2 or 3
}
  • 使用默认枚举值
//	enum 枚举名 {
//    	枚举项 1,
//    	枚举项 2,
//   	...
//	}
// 枚举值将自动生成从 0 开始的数值
enum GunType {
  M4A1, // -> 0
  AK47, // -> 1
  Goza // -> 2
}

# 类型断言 as

通过类型断言这种方式可以告诉编译器,“相信我,我知道自己在干什么”。他没有运行时的影响,只有在编译阶段起作用。 TypeScript 会假设你,程序员,已经进行了必须的检查

<type>

{
  let str: unknown = 'hello, my name is ming';
  let strLen: number = (<string>str).length; // 22
}

as 等价于 <type> ,因为 <type> 会和 jsx/tsx 代码混淆,所以推荐用 as

{
  let str: unknown = 'hello, my name is ming';
  let strLen: number = (str as string).length; // 22
}

# unknown 和 any

在项目开发中应该使用 unknown ,避免使用 any

anyunknown 的最大区别是

unknowntop type (任何类型都是它的 subtype )

any 即是 top type , 又是 bottom type (它是任何类型的 subtype )

这导致 any 基本上就是放弃了任何类型检查

{
  // unknown
  let notSure1: unknown = [1];
  notSure1 = 123456;
  notSure1 = 'holy shit';
  notSure1 = false;
  //error: 不能将类型 “unknown” 分配给类型 “number”。ts (2322)
  const n1: number = notSure1;
  const objUnknown: unknown = {
    sayHello() {}
  };
  //error: 对象的类型为 "unknown",找不到该方法所以报错了
  objUnknown.sayHello()(
    // 可使用类型断言缩小未知范围
    objUnknown as { sayHello: () => {} }
  ).sayHello;
}
{
  // any
  // 使用 any,不会检查出错误,就会导致程序出现 bug
  const objAny: any = {
    sayHello() {}
  };
  objAny.hello(); // 这是错误的,ts 并没有进行检查
}

# void

  • 概念:void 代表没有类型,一般用在无返回值函数
  • 语法
function sayHi1(): string {
  return 'hi,你好啊~~~';
}
let re1 = sayHi1();
function sayHi1(): void {
  console.log('讨厌~~~');
}
sayHi2();

# 联合类型

  • 概念 :表示取值可以为多种类型中的一种
//let 变量名:变量类型 1 | 变量类型 2 = 值;
  • 接收 prompt() 函数的返回值
image-20210412173113138
  • 要么是字符串要么是 null,这个时候就可以用联合类型
let dName: string | null = prompt('请输入小狗狗名字');
console.log('hello + dName');

# 返回值和参数

// 函数 返回值类型
function sayHi(): string {
  return 'hi~hello';
}
let res: string = sayHi();
// 函数 形参类型
function from(cityName: string): void {
  //void 无返回值
  console.log('你来自哪里');
  console.log(`我来自${cityName}`);
}
//ts 中 实参 必须和 形参 的 类型一致 数量一致
from('加拿大');
//from (); // 报错没传参

image-20210412175333783

  • 函数必须定义 返回值类型,如果没有返回值, 则定义返回值类型为 void

# 可选参数

  • 函数 可选参数
// 可选参数的实参可传也可不传,只需要在形参后面加一个问号即可
//function 函数名 (形参?: 类型): 返回值类型 {
// }
// ! 表示一定存在
//function 函数名 (形参!: 类型): 返回值类型 {
// }
  • 调用

    传参 函数名 ();

    不传参 函数名 (实参值);

# 默认值

  • 函数 默认值 形参 1?: 类型 = 默认值 1 带默认值的参数,本身也是可选参数
function test(city: string = '加拿大', phone: number = 1): String {
  return 'yes';
}
  • 调用

    image-20210412181303380

# Record

Record 用于定义一个对象的键值对

interface PageInfo {
  title: string;
}
type Page = 'home' | 'about' | 'contact';
const nav: Record<Page, PageInfo> = {
  home: { title: 'home' },
  about: { title: 'about' },
  contact: { title: 'contact' }
};

Record 后面的泛型就是对象键和值的类型。

示例:比如我需要一个对象,有 ABC 三个属性,属性的值必须是数字,那么就这么写

type keys = 'A' | 'B' | 'C';
const result: Record<keys, number> = {
  A: 1,
  B: 2,
  C: 3
};

# 结语

每天下班累的只想躺着什么也不干,哪怕这一天其实没有很忙,但是那种疲惫却是避开肌肉筋骨,直到心神。—— 佚名