以下是我前几个月实习开始的时候学习TS记录的笔记
是在这个网站上面做练习，这里是部分答案和自己的记录

https://typescript-exercises.github.io/

联合类型

第二题

interface User {
    name: string;
    age: number;
    occupation: string;
}

interface Admin {
    name: string;
    age: number;
    role: string;
}

export type Person = User | Admin;

这里的Person就是联合类型，意思是，可以是User 也可以是Admin
但是只能是其中一个，而不是同时拥有他们的属性，比如
{

name: "x",
age: 1,
role: "r",
occupation: "o"

}

类型推断

第三题

export function logPerson(person: Person) {
    let additionalInformation: string;
    /*
    if ((<Admin>person).role) {
        additionalInformation = (<Admin>person).role;
    } else {
        additionalInformation = (<User>person).occupation;
    }
    ------
    使用is in instanceof typeof hasOwnProperty 等关键字使TS可以自动推断
    if ("role" in person) { // 
        additionalInformation = person.role;
    } else {
        additionalInformation = person.occupation;
    }
    */

   
    if ((person as Admin).role) {
        additionalInformation = (person as Admin).role;
    } else {
        additionalInformation = (person as User).occupation;
    }
    console.log(` - ${person.name}, ${person.age}, ${additionalInformation}`);
}

类型收敛

第四题
is操作符

export function isAdmin(person: Person): person is Admin {
  return person.type === "admin";
}

export function isUser(person: Person): person is User {
  return person.type === "user";
}

Partial

第五题
把一个type或者interface的属性全部变为可选的

export function filterUsers(persons: Person[], criteria: Partial<User>): User[] {}
filterUsers(
    persons,
    {
        age: 23
    }
).forEach(logPerson)

函数重载

第六题
filterPersons根据不同的接收值有不同的返回值，所以做一个函数的重载

export function filterPersons(persons: Person[], personType: 'admin', criteria: Partial<Person>): Admin[]
export function filterPersons(persons: Person[], personType: 'user', criteria: Partial<Person>): User[]
export function filterPersons(persons: Person[], personType: string, criteria: Partial<Person>): Person[] {
    return persons
        .filter()
        .filter(();
}

泛型

第七题

export function swap<T, U>(v1: T, v2: U): [U, T] {
    return [v2, v1];
}

Omit

第八题
Omit是返回一个type，是除去第二个属性的第一个type
也就是下面的代码中的User & Admin 除去里面的type，然后后面又 联合 了一个type 组成的新类型 PowerUser

type PowerUser = Omit<User & Admin, "type"> & { type: "powerUser" };

第九题

export type ApiResponse<T> = {status: "success"; data: T} | {status: "error"; error: string};
type UsersApiResponse = ApiResponse<User[]>;
type AdminsApiResponse = ApiResponse<Admin[]>;
export function requestAdmins(callback: (response: AdminsApiResponse) => void) {}
export function requestUsers(callback: (response: UsersApiResponse) => void) {}
export function requestCurrentServerTime(callback: (response: ApiResponse<number>) => void) {}
export function requestCoffeeMachineQueueLength(callback: (response: ApiResponse<number>) => void) {} // 这里为啥只有number才可以？？？？？？

第十题
泛型，and promisify

promisify js版：

// const promisify = fn => (...args)=>{
//     return new Promsie((resolve,reject)=>{
//         fn(...args,function(err,data) {
//             if(err) reject(err)
//             resolve(data)
//         })
//     })
// }

function promisify(fn) {
    return function() {
        return new Promise((resolve, reject) => {
            fn(res => {
                if (res.status === "success") resolve(res.data);
                else reject(res.error);
            })
        })
    }
}

由于fn只接受一个callback，并且参数中有 status = "success"和data 或者是 error(status === "error"时)
所以

export function promisify<T>(fn: (callback: (response: ApiResponse<T>) => void) => void): () => Promise<T> {
    return function() {
        return new Promise((resolve, reject) => {
            fn(res => {
                if (res.status === "success") resolve(res.data);
                else reject(res.error);
            })
        })
    }
}

声明

第十一题
声明是给库函数声明每个API的类型
在左边有个文件夹declarations
里面的str-utiles/index.d.ts
加入

declare module "str-utils" {
  export function strReverse(s: string): string;
  export function strToLower(s: string): string;
  export function strToUpper(s: string): string;
  export function strRandomize(s: string): string;
  export function strInvertCase(s: string): string;
}

第十二题
也是加声明，而且里面有了一个module，在module里面的state中
并且有泛型

declare module 'stats' {
    type Comparator<T> = (a: T, b: T) => number;

    type GetIndex = <T>(input: T[], comparator: Comparator<T>) => number;
    export const getMaxIndex: GetIndex;
    export const getMinIndex: GetIndex;
    export const getMedianIndex: GetIndex;

    type GetElement = <T>(input: T[], comparator: Comparator<T>) => T | null;
    export const getMaxElement: GetElement;
    export const getMinElement: GetElement;
    export const getMedianElement: GetElement;

    export const getAverageValue: <T>(input: T[], getValue: (item: T) => number) => number | null;
}

第十三题

// This enables module augmentation mode.
import "date-wizard";

declare module "date-wizard" {
  // Add your module extensions here.
  function dateWizard(date: string, format: string): string;
  function pad(s: number): string;
  interface DateDetails {
    year: number;
    month: number;
    date: number;
    hours: number;
    minutes: number;
    seconds: number;
  }
  function dateDetails(date: Date): DateDetails;
}


// or //

import "date-wizard";

declare module "date-wizard" {
  function dateWizard(date: string, format: string): string;
  function pad(s: number): string;
  interface DateDetails {
    hours: number;
    minutes: number;
    seconds: number;
  }
  function dateDetails(date: Date): DateDetails;
}

第十三题官方解法

import 'date-wizard';

declare module 'date-wizard' {
    const pad: (s: number) => string;

    interface DateDetails {
        hours: number;
        minutes: number;
        seconds: number;
    }
}