TypeScript基础

Copy 
1number;
2
3string;
4
5boolean;
6
7array;
8
9object;
10
11bigint;
12
13symbol;
14
15null;
16
17undefined;
18
19Date;
20
21Error;
22
23RegExp;

Copy 
1let age: number = null;
2let realName: string = undefined;

Copy 
1function welcome(): void {
2  console.log("hello");
3}

Copy 
1const A: never = 1; // error

Copy 
1let tuple: [number, string] = [18, "lin"];

Copy 
1function add(x: number, y: number, z?: number): number {
2  return x + y;
3}
4
5add(1, 2, 3);
6add(1, 2);

Copy 
1enum HttpMethod {
2  GET,
3  POST,
4  PATCH,
5  PUT,
6  DELETE,
7}
8type K = keyof typeof HttpMethod; // 'GET'|'POST'|'PATCH'|'PUT'|'DELETE'

Copy 
1enum Direction {
2    Up = "UP",
3    Down = "DOWN",
4    Left = "LEFT",
5    Right = "RIGHT",
6}
7
8const value = 'UP'
9if (value === Direction.Up) {
10    // do something
11}

Copy 
1const enum Direction {
2    Up = "UP",
3    Down = "DOWN",
4    Left = "LEFT",
5    Right = "RIGHT",
6}
7
8const value = 'UP'
9if (value === Direction.Up) {
10    // do something
11}

Copy 
1interface Person {
2    name: string
3    age: number
4}
5
6const p1: Person = {
7    name: 'lin',
8    age: 18
9}

Copy 
1let a: string | number;
2a = 1; //ok
3a = "a"; //ok

Copy 
1interface Women {
2  age: number;
3  sex: string;
4  cry(): void;
5}
6interface Man {
7  age: number;
8  sex: string;
9}
10declare function People(): Women | Man;
11let people = People();
12people.age = 18; //ok
13people.cry(); //error 非共同成员

Copy 
1interface Women {
2  age: number;
3  sex: string;
4  cry(): void;
5}
6interface Man {
7  age: number;
8  sex: string;
9}
10declare function People(): Women | Man;
11let people = People();
12people.age = 18; //ok
13people.cry(); //ok 共同成员

Copy 
1function toArray(x: number): Array<number> {
2  return [x];
3}
4
5type Func = typeof toArray; // -> (x: number) => number[]

Copy 
1interface Person {
2  name: string;
3  age: number;
4}
5type K1 = keyof Person; // "name" | "age"

Copy 
1type K1 = keyof boolean; // "valueOf"
2type K2 = keyof any; // string | number | symbol

Copy 
1type Keys = "a" | "b" | "c";
2
3type Obj = {
4  [p in Keys]: any;
5}; // -> { a: any, b: any, c: any }

Copy 
1function getCnames<T extends { name: string }>(entities: T[]): string[] {
2  return entities.map((entity) => entity.cname);
3}

Copy 
1interface ILengthwise {
2  length: number;
3}
4
5function loggingIdentity<T extends ILengthwise>(arg: T): T {
6  console.log(arg.length);
7  return arg;
8}
9
10loggingIdentity(3);
11loggingIdentity({ length: 10, value: 3 });

Copy 
1// Partial
2interface People {
3  name: string;
4  age: number;
5}
6
7// 报错 类型“{}”缺少类型“People”中的以下属性: name, age
8const person1: People = {};
9
10/**
11  那这个时候我们就可以用到typescript自带的高级类型 Partial，就相当于将上方接口所有属性变成可选的
12  将我们需要定义的类型当做泛型传入Partial中，那么就相当于当前的类型里面的所有属性都是可选的
13 */
14const person2: Partial<People> = {}; // 可以
15const person3: Partial<People> = { name: "xiaodu" }; // 可以
16const person4: Partial<People> = { sex: "男" }; // 报错 “sex”不在类型“Partial<People>”中

Copy 
1// 必选参数
2interface People {
3  name?: string;
4  age?: number;
5}
6// 类型 "{ name: string; }" 中缺少属性 "age"，但类型 "Required<People>" 中需要该属性
7const person2: Required<People> = {
8  name: "11",
9};

Copy 
1// 只读
2interface People {
3  name: string;
4  age: number;
5  dog: {
6    name: string;
7    age: number;
8  };
9}
10const xiaoling: Readonly<People> = {
11  name: "小凌", // 只读
12  age: 18, // 只读
13  dog: {
14    age: 1,
15    name: "大黄",
16  },
17};
18// 但是是浅层的。
19xiaoling.name = "john"; // 无法分配到 "name" ，因为它是只读属性。
20xiaoling.dog.age = 2; // 可以

Copy 
1interface PageInfo {
2  title: string;
3}
4
5type Page = "home" | "about" | "contact";
6
7const x: Record<Page, PageInfo> = {
8  about: { title: "about" },
9  contact: { title: "contact" },
10  home: { title: "home" },
11};

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

Copy 
1interface IPerson {
2    name: string
3    age: number
4}
5
6type IOmit = Omit<IPerson, 'age'>
7/**
8 type somePeople = {
9    name: string;
10}
11 */

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

Copy 
1type Coord = Record<"x" | "y", number>;
2type CoordX = Pick<Coord, "x">;
3
4// 等用于
5type CoordX = {
6  x: number;
7};

Copy 
1class Stack<T> {
2    private data: T[] = []
3    push(item:T) {
4        return this.data.push(item)
5    }
6    pop():T | undefined {
7        return this.data.pop()
8    }
9}

Copy 
1type T1 = Parameters<() => string>; // []
2
3type T2 = Parameters<(arg: string) => void>; // [string]
4
5type T3 = Parameters<(arg1: string, arg2: number) => void>; // [arg1: string, arg2: number]

Copy 
1type T0 = ReturnType<() => string>; // string
2
3type T1 = ReturnType<(s: string) => void>; // void

Copy 
1interface PropChangeHandler {
2  [key: `${string}Changed`]: () => void;
3}
4
5let handlers: PropChangeHandler = {
6  idChanged: () => {}, //ok
7  nameChanged: () => {}, //ok
8  ageChange: () => {}, //error
9};

Copy 
1type User1 = {
2  [key: "id"]: string; //error
3};
4type User2 = {
5  [key: "id" | "name"]: string; //error
6};
7type User3 = Record<"id", string>;
8type User4 = Record<"id" | "name", string>;

Copy 
1let requestMethod = 'Get';
2let requestMethod2 = 'Get' as const;
3
4type R0 = typeof requestMethod; //string
5type R1 = typeof requestMethod2; // 'Get'