Typescript 14 starting from 0: built in tool type

order

Prior to 《 from 0 At the beginning TypeScriptの 13、 ... and 》 in , Have been to typescript Keywords in the tool type of infer、extends、keyof、typeof、in I know something about this , Then, in order to make it more convenient to use , It can be done to typescript Learn some about the built-in tool types in .

Tool type name	describe	usage
Readonly<T>	take T All properties in become read-only	Readonly<{ a: number }> <===> { readonly a: number }
ReadonlyArray<T>	Return to one T Read only array of type	ReadonlyArray<string> <===> readonly string[]
Partial<T>	take T All properties in the become optional types	Partial<{ a: number }> <===> { a?: number }
Required<T>	take T All properties in the become mandatory types	And the above Partial Just the opposite
Pick<T, K extends keyof T>	from T Extract some attributes from	Pick<{ a: number, b: string, c: boolean }, 'a' | 'c'> <===> { a: number, c: boolean }
Omit<T, K extends keyof T>	from T Exclude some attributes from the	Omit<{ a: number, b: string, c: boolean }, 'a' | 'c'> <===> { b: string }
Exclude<T, U>	from T Weeding can be assigned to U The type of	Exclude<number | string | boolean, string> <===> number | boolean
Extract<T, U>	extract T Can be assigned to U The type of	Exclude<number | string | boolean, string> <===> string
Record<K, T>	The return property name is K, The property value is T The type of	Record<'a' | 'b', () => void> <===> { a: ()=>void, b: ()=>void }
NonNullable<T>	from T Middle elimination null and undefined	NonNullable<string | null | undefined> <===> string
ConstructorParameters<T>	obtain T Of Constructors Tuples of parameter types	Compare It's a class , Constructors constructor(a: number, b:number){ ... }. ConstructorParameters<typeof Compare> <===> [ a: number, b: number]
InstanceType<T>	By the constructor type T To build a new type	InstanceType<typeof Compare> <===> Compare
Parameters<T>	Get tuples composed of function parameter types	Parameters<(a: number, b: string) => number> <===> [ a: number, b: number]
ReturnType<T>	Get function return value type	ReturnType<(a: number, b: string) => number> <===> number

The above built-in tool types can greatly simplify the code .

For example, given a interface Interface , You need to turn all internal attributes into optional types

Although we can write it ourselves , But if you directly use the existing built-in tool types Partial Isn't it better

interface A {
    
    name: string,
    age: number,
    action: ()=>void
}
type PartialFun<T> = {
    
    [K in keyof T] ? : T[K]
}
type _A = PartialFun<A>

Or I saw a conversion topic on the Internet ：

• How to define a SetOptional Tool type , Support the given keys The corresponding attribute becomes optional ？

type Foo = {
    
	a: number;
	b?: string;
	c: boolean;
}

//  The test case 
type SomeOptional = SetOptional<Foo, 'a' | 'b'>;

This way of thinking when revising , Need to be right Foo And a | b The matching attribute is removed to become optional , Then the mismatched attributes remain unchanged , Finally, the optional and non optional are passed & To unite

//  The corresponding attribute becomes optional 
type CommonFun<T, K> = {
    
    [ t in keyof T as t extends K ? t: never] ?: T[t]
}
//  Attributes that do not correspond 
type Unequal<T, K> = {
    
    [ t in keyof T as t extends K ? never: t] : T[t]
}
type SetOptional<T, K> = CommonFun<T, K> & Unequal<T, K> 

However, although the idea is very clear , But it seems to write a lot . in fact , have access to Partial and Pick Instead of CommonFun, And then use Omit Instead of Unequal

Just like the following sentence can solve , Is it a lot of code reduction

type SetOptional<T, K extends keyof T> = Partial<Pick<T, K>> & Omit<T, K> 

---

Of course, these are based on typescript When the built-in type is familiar , The best way is to use more . Just like when I first started learning javascript when , about Math.floor、splice These methods can only be familiar with by using more .

Of course, the above examples may not be practical , So flattening the array type should be a little practical

take [ number, [string], [ boolean, [ void, string ] ] ] convert to number | string | boolean | void Flattening Union

It's easy to think of such an example Recursive function

Solution ： use first infer X[] Judge the elements in the current array , If it is not an array, it will directly return , Otherwise, the element re enters SetOptional Judgment cycle .

type ArrType = [ number, [string], [ boolean, [ void, string ] ] ]

type SetOptional<T> = T extends (infer X)[] ? SetOptional<X> : T
// string | number | boolean | void
type Res = SetOptional<ArrType>