typeScript 基础

基础知识

基础类型: number string boolean array object

let a: number = 0

enum: 枚举 常量的集合

// 不赋值 值是从0开始依次往下
enum ActivityStatus {
	NOT_START, // 0 
	STARTED  // 1
}
 // 赋值 显示就是对应的值
enum ActivityStatus {
	NOT_START = 'notStart',
	STARTED = 'started'
}
 // 使用
const status = ActivityStatus.NOT_START

type, interface 主要用来声明类型

type UserInfo = {
	name: string; // 类型约束 不加?  表示必选项 必传
	height?: number;  // 类型约束 加? 表示 可选项 可不传
}

interface  UserInfo = {
	name: string;
	height?: number;
}

// 使用
const userInfo: UserInfo = {} // 会报错  必传项没传

联合类型 “ | ” (联合类型一次只能一种类型；而交叉类型每次都是多个类型的合并类型)

interface  UserInfoA = {
	name: string;
	height?: number;
}

interface  UserInfoB = {
	wiidth: number;
}

function test (param: UserInfoA | UserInfoB) {}

交叉类型 “&” (联合类型一次只能一种类型；而交叉类型每次都是多个类型的合并类型)

interface  UserInfoA = {
	name: string;
	height?: number;
}

interface  UserInfoB = {
	wiidth: number;
}

function test (param: UserInfoA & UserInfoB) {}

typeof js中用于类型判断 ts 用于获取一个已有变量或22常量的类型

typeof 'a' // string

function toArray(x: number):Array<number> { 
	return [x]
}


type Fuunc = typeof toArray // (x: number) => number[]

typeof 操作符可以用来获取一个变量声明或对象的类型。

function toArray(x: number): Array<number> {
  return [x];
}

type Func = typeof toArray; // -> (x: number) => number[]

keyof

keyof 操作符可以用来获取一个对象中的所有 key 值：

interface Person {
    name: string;
    age: number;
}

type KPerson = keyof Person; // "name" | "age"

const str:KPerson = 'name'  或者  const str:KPerson = 'age'  赋值其他类型会报错

in

in 用来遍历枚举类型

type Keys = "a" | "b" | "c"

type Obj =  {
  [key in Keys]: any
} // -> { a: any, b: any, c: any }

extends js中继承的是逻辑 ts中继承的是类型

有时候我们定义的泛型不想过于灵活或者说想继承某些类等，可以通过 extends 关键字添加泛型约束。

cILength {
  length: number;
}

function loggingIdentity<T extends ILength>(arg: T): T {
  console.log(arg.length);
  return arg;
}

loggingIdentity(3);  // 会报错  如果传如的是字符串、数组 有length 的不会报错
loggingIdentity({length: 10, value: 3}); // 不会报错

Paritial

Partial 的作用就是将某个类型里的属性全部变为可选项 “ ?”。

interface PageInfo {
	title: string
}

type OptionalPageInfo = Partial<PageInfo>  相当于
interface PageInfo {
	title?: string
}

Reuqired

Required 的作用就是将某个类型里的属性全部变为必选项 。

interface PageInfo {
	title?: string
}

type OptionalPageInfo = Required<PageInfo>  相当于
interface PageInfo {
	title: string
}

Readonly

Readonly 的作用是将某个类型所有属性变为只读属性，也就意味着这些属性不能被重新赋值。

interface PageInfo {
	title: string
}


type ReadonlyPageInfo = Readonly<PageInfo>
const pageInfo: ReadonlyPageInfo = {title: ''}
pageInfo.title = '123' // 会报错

Record

Record<K extends keyof any, T> 的作用是将 K 中所有的属性的值转化为 T 类型。

interface PageInfo {
  title: string;
}

type Page = "home" | "about" | "contact";

const x: Record<Page, PageInfo> = {
  about: { title: "xxxx" },
  contact: { title: "xxxx" },
  home: { title: "xxxx" }
};

Exclude

Exclude<T, U> 的作用是将某个类型中属于另一个的类型移除掉。

type T0 = Exclude<"a" | "b" | "c", "a">; // "b" | "c"
type T1 = Exclude<"a" | "b" | "c", "a" | "b">; // "c"

Extract

Extract<T, U> 的作用是从 T 中提取出 U。 (取 T 和 U的交集) 没交集 为 never

type T0 = Extract<"a" | "b" | "c", "a" | "f">; // "a"
type T1 = Extract<string | number | (() => void), Function>; // () => void