typescript 内置类型

  • TS 中的符号

    • ! 断言
    • ?. 链判断操作符
  • TS关键字

    • type
    • interface
    • typeof
    • keyof
    • in
  • TS 内置类型
    - Partial 将内置属性边可选
    - Required 将类型属性边必选
    - pick 从某个类型中挑出一些属性
    - Record
    - Mutable 将类型的属性边城可修改
    - Readonly 类型的属性变只读
    - ReturnType 用来得到一个函数的返回值类型

EG

! 的作用是断言某个变量不会是 null/undefined,告诉编辑器停止报错。
?. 支持如下语法
	obj?.prop // 对象属性
	obj?.[expr] // 对象属性
	arr?.[index] // 获取数据中 index 下标对应的值
	func?.(...args) // 函数或对象方法的调用

TS 关键字

`type `类型别名用来给类型起一个新名字
		type setUser = (name: string,age: number) => viod
类型别名常用语联合类型 (联合类型表示取值可以为多种类型中的一种)

 interface 用来定义类型
type interface 的区别
都支持拓展,单语法不同
interface Name {
	name: string;
}
interface User extends Name {
	age: number ;
}
------------
type Name {
	name: string;
}

type User = name & { age: number }


typeof 可以获取一个变量声明类型 、

const obj = { a: '1' }
type foo = typeof obj
 // type foo  = { a: string}

keyof 可以获取一个对象接口所有的KEY值

type obj = { a: string; b: string }
type foo = keyof obj;
// type foo = 'b' | 'a'

in 可以遍历枚举类型

type keys = 'a'  |  'b'   |  'c' ;
type obj = { [T in keys ] : string }

/*
* in 遍历keys ,并未每个值赋予string 类型
	type obj = {
	a: string
	b: string
	c: string

}

**/

TS 内置的类型

Parial 将类型的属性变为可选

功能是将类型的属性变成可选,  (中文翻译为 局部的 部分的)
实现原理
type Partial<T> ={ [p in keyof T ]?: T[p]}

eg:
	interface userInfo {
			id: string;
			name: string
		}
	 error:Property 'id' is missing in type '{ name: string; }' but required in type 'UserInfo'
	const xiaoming: userInfo = { name: 'xiaoming }

使用 Partial<T>
	type newUserInfo = Partial<userInfo>
	const xiaoming : newUserInfo = {
		name: 'xiaoming'
	}
 newUserInfo 相当于
	interface  newUserInfo {
		id?: string;
		name?: string
	}
	
但是 Partial<T> 有个局限性,就是只支持处理第一层的属性

interface UserInfo {
    id: string;
    name: string;
    fruits: {
        appleNumber: number;
        orangeNumber: number;
    }
}

type NewUserInfo = Partial<UserInfo>;
// Property 'appleNumber' is missing in type '{ orangeNumber: number; }' but required in type '{ appleNumber: number; orangeNumber: number; }'.
const xiaoming: NewUserInfo = {
    name: 'xiaoming',
    fruits: {
        orangeNumber: 1,
    }
}

可以看到,第二层以后就不会处理了,如果要处理多层,就可以自己通过  Conditional Types[2]

DeepPartial

type DeepPartial<T> = {
     // 如果是 object,则递归类型
    [U in keyof T]?: T[U] extends object
      ? DeepPartial<T[U]>
      : T[U]
};

type PartialedWindow = DeepPartial<Window>; // 现在window 上所有属性都变成了可选啦

Required 将类型的属性变成必选

实现逻辑
	type Required<T> = {
		[p in keyof T] -? : T[p]
	}
// -? 代表移除 ? 这个标识 
	还可以运用在 readonly  比如Readonly<T> 
	type Reacdonly<T> = {
		readonly [p in keyof T] : T[p]
	}

Pick 从某个类型中挑出一些属性来

 type Pick<T, K extends keyof T > = { 
	[p in K ]: T[p]
}

interface userInfo {
	id: string;
	name: string;
}

type newUserInfo = Pick<userinfo,'name'> 
// type  newUserInfo  =  {name:string}

Record 可以获取根据K中所有可能的值以及value 的类型

实现原理:
type Record<K extends keyof any, T> ={
	[P in K]: T
}
eg:
	type curRecord = Record<'a' | 'b' | 'c', userInfo>
	(有点类似遍历设置每个属性的类型)
	type curRecord = { a: userInfo; b: userInfo; c: userInfo;}

Mutable 将类型的属性变为可修改

实现原理 
	跟上面的实现必选 类似 , 就是去除只读属性
type Mutable<T> = {
  -readonly [P in keyof T]: T[P];
};

Readonly 类型的属性变成只读

实现原理
	type Readonly<T> = { 
   		 readonly [P in keyof T]: T[P] 
	};

ReturnType 用来得到一个函数的返回值类型

type ReturnType<T extends (...args: any[]) => any> = T extends (...args: any[]) => infer R ? R : any

infer在这里用于提取函数类型的返回值类型。ReturnType<T> 只是将 infer R 从参数位置移动到返回值位置,因此此时 R 即是表示待推断的返回值类型。
// infer 标识extends 语句中待推断的类型变量  
	官方解释: infer 关键词常在条件类型中和 extends 关键词一同出现,表示将要推断的类型,作为类型变量可以在三元表达式的 True 部分引用。而 ReturnType 正是使用这种方式提取到了函数的返回类型。
	这个有点绕 可以看着 https://zhuanlan.zhihu.com/p/133249506?from_voters_page=true
eg: 
	 // 示例用ReturnType获取到 Func 的返回值类型为 string,所以,foo 也就只能被赋值为字符串了。
type Func = (value: number) => string;
const foo: ReturnType<Func> = "1";

你可能感兴趣的:(typescript)