Woongjae Lee
Daangn - Frontend Core Team ex) NHN Dooray - Frontend Team Leader ex) ProtoPie - Studio Team
Lead Software Engineer @ProtoPie
Microsoft MVP
TypeScript Korea User Group Organizer
Marktube (Youtube)
이 웅재
interface StringContainer {
value: string;
format(): string;
split(): string[];
}
interface NumberContainer {
value: number;
nearestPrime: number;
round(): number;
}
type Item1<T> = {
id: T,
container: any;
};
const item1: Item1<string> = {
id: "aaaaaa",
container: null
};
type Item2<T> = {
id: T;
container: T extends string ? StringContainer : NumberContainer;
};
const item2: Item2<string> = {
id: 'aaaaaa',
container: null, // Type 'null' is not assignable to type 'StringContainer'.
};
type Item3<T> = {
id: T extends string | number ? T : never;
container: T extends string
? StringContainer
: T extends number
? NumberContainer
: never;
};
const item3: Item3<boolean> = {
id: true, // Type 'boolean' is not assignable to type 'never'.
container: null, // Type 'null' is not assignable to type 'never'.
};
type ArrayFilter<T> = T extends any[] ? T : never;
type StringsOrNumbers = ArrayFilter<string | number | string[] | number[]>;
// 1. string | number | string[] | number[]
// 2. never | never | string[] | number[]
// 3. string[] | number[]
interface Table {
id: string;
chairs: string[];
}
interface Dino {
id: number;
legs: number;
}
interface World {
getItem<T extends string | number>(id: T): T extends string ? Table : Dino;
}
let world: World = null as any;
const dino = world.getItem(10);
const what = world.getItem(true); // Error! Argument of type 'boolean' is not assignable to parameter of type 'string | number'.ts(2345)
type Flatten<T> = T extends any[]
? T[number]
: T extends object
? T[keyof T]
: T;
const numbers = [1, 2, 3];
type NumbersArrayFlattened = Flatten<typeof numbers>;
// 1. number[]
// 2. number
const person = {
name: 'Mark',
age: 38
};
type SomeObjectFlattened = Flatten<typeof person>;
// 1. keyof T --> "id" | "name"
// 2. T["id" | "name"] --> T["id"] | T["name"] --> number | string
const isMale = true;
type SomeBooleanFlattened = Flatten<typeof isMale>;
// true
type UnpackPromise<T> = T extends Promise<infer K>[] ? K : any;
const promises = [Promise.resolve('Mark'), Promise.resolve(38)];
type Expected = UnpackPromise<typeof promises>; // string | number
function plus1(seed: number): number {
return seed + 1;
}
type MyReturnType<T extends (...args: any) => any> = T extends (
...args: any
) => infer R
? R
: any;
type Id = MyReturnType<typeof plus1>;
lookupEntity(plus1(10));
function lookupEntity(id: Id) {
// query DB for entity by ID
}
// type Exclude<T, U> = T extends U ? never : T;
type Excluded = Exclude<string | number, string>; // number - diff
// type Extract<T, U> = T extends U ? T : never;
type Extracted = Extract<string | number, string>; // string - filter
// Pick<T, Exclude<keyof T, K>>; (Mapped Type)
type Picked = Pick<{name: string, age: number}, 'name'>;
// type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
type Omited = Omit<{name: string, age: number}, 'name'>;
// type NonNullable<T> = T extends null | undefined ? never : T;
type NonNullabled = NonNullable<string | number | null | undefined>;
/*
type ReturnType<T extends (...args: any) => any> = T extends (
...args: any
) => infer R
? R
: any;
*/
/*
type Parameters<T extends (...args: any) => any> = T extends (
...args: infer P
) => any
? P
: never;
*/
type MyParameters = Parameters<(name: string, age: number) => void>; // [name: string, age: number]
type FunctionPropertyNames<T> = {
[K in keyof T]: T[K] extends Function ? K : never;
}[keyof T];
type FunctionProperties<T> = Pick<T, FunctionPropertyNames<T>>;
type NonFunctionPropertyNames<T> = {
[K in keyof T]: T[K] extends Function ? never : K;
}[keyof T];
type NonFunctionProperties<T> = Pick<T, NonFunctionPropertyNames<T>>;
interface Person {
id: number;
name: string;
hello(message: string): void;
}
type T1 = FunctionPropertyNames<Person>;
type T2 = NonFunctionPropertyNames<Person>;
type T3 = FunctionProperties<Person>;
type T4 = NonFunctionProperties<Person>;
interface Constructor {
new (name: string, age: number): string;
}
/*
type ConstructorParameters<
T extends new (...args: any) => any
> = T extends new (...args: infer P) => any ? P : never;
*/
type MyConstructorParameters = ConstructorParameters<Constructor>; // [name: string, age: number]
/*
type InstanceType<T extends new (...args: any) => any> = T extends new (
...args: any
) => infer R
? R
: any;
*/
type MyInstanceType = InstanceType<Constructor>; // string
type DeepReadonly<T> = T extends (infer E)[]
? ReadonlyArray<DeepReadonlyObject<E>>
: T extends object
? DeepReadonlyObject<T>
: T;
type DeepReadonlyObject<T> = { readonly [K in keyof T]: DeepReadonly<T[K]> };
type IDeepReadonlyRootState = DeepReadonly<IRootState>;
let state2: IDeepReadonlyRootState = {} as IDeepReadonlyRootState;
const book2 = state2.book.books[0];
book2.title = 'new'; // error! Cannot assign to 'title' because it is a read-only property.
By Woongjae Lee
2020 공개SW페스티벌
Daangn - Frontend Core Team ex) NHN Dooray - Frontend Team Leader ex) ProtoPie - Studio Team