深入 TypeScript 当中的泛型

function identity(value) {
  return value
}

identity(1)

function identity(value: Number): Number {
  return value
}

identity(1)   // ✅

identity('1') // ❌

function identity<T>(value: T): T {
  return value
}

identity<Number>(1)    // ✅

identity<string>('1')  // ✅

function identity<T, U>(value: T, message: U): T {
  console.log(message)
  return value
}

identity<Number, string>(18, 'zhangsan')

function identity<T, U>(value: T, message: U): T {
  console.log(message)
  return value
}

identity(18, 'zhangsan')

// function identity<18, number>(value: 18, message: number): 18
identity(18, 18)

// function identity<'abc', number>(value: 'abc', message: number): 'abc'
identity('abc', 18)

// function identity<'abc', string>(value: 'abc', message: string): 'abc'
identity('abc', 'abc')

function identity<T = string, U = number>(value: T, message: U): T {
  console.log(message)
  return value
}

function identity<T, U>(value: T, message: U): T {
  console.log(message)
  return value
}

function identity<T, U>(value: T, message: U): [T, U] {
  return [value, message]
}

interface Identities<V, M> {
  value: V,
  message: M
}

function identity<T, U>(value: T, message: U): Identities<T, U> {
  let identities: Identities<T, U> = {
    value,
    message
  }
  return identities
}

identity(18, 'zhangsan')

interface GenericInterface<U> {
  value: U
  getIdentity: () => U
}

class IdentityClass<T> implements GenericInterface<T> {
  value: T
  constructor(value: T) {
    this.value = value
  }
  getIdentity(): T {
    return this.value
  }

}

const myNumberClass = new IdentityClass<Number>(18)
myNumberClass.getIdentity()  // 18

const myStringClass = new IdentityClass<string>('zhangsan')
myStringClass.getIdentity()  // zhangsan

function identity<T>(arg: T): T {
  // ❌
  console.log(arg.length)
  return arg
}

interface Length {
  length: number
}

function identity<T extends Length>(arg: T): T {
  console.log(arg.length)
  return arg
}

identity('zhangsan')  // ✅

identity(1234567890)  // ❌

// ✅
identity({ length: 10, value: 3 })

function identity<T>(arg: T[]): T[] {
  console.log(arg.length)
  return arg
}

// or

function identity<T>(arg: Array<T>): Array<T> {
  console.log(arg.length)
  return arg
}

function copyFields<T extends U, U>(target: T, source: U): T {
  for (let id in source) {
    target[id] = (<T>source)[id]
  }
  return target
}

let x = { a: 1, b: 2, c: 3, d: 4 }

copyFields(x, { b: 10, d: 20 })

interface Person {
  name: string
  age: number
}

type K2 = keyof Person[]                 // number | 'length' | 'push' ...
type K1 = keyof Person                   // 'name' | 'age'
type K3 = keyof { [x: string]: Person }  // string | number

interface StringArray {
  // 字符串索引 => keyof StringArray => string | number
  [index: string]: string;
}

interface StringArray1 {
  // 数字索引 => keyof StringArray1 => number
  [index: number]: string;
}

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key]
}

enum Difficulty {
  Easy,
  Intermediate,
  Hard
}

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key]
}

let tsInfo = {
  name: 'Typescript',
  supersetOf: 'Javascript',
  difficulty: Difficulty.Intermediate
}

let difficulty: Difficulty = getProperty(tsInfo, 'difficulty')  // ✅

let supersetOf: string = getProperty(tsInfo, 'superset_of')     // ❌

Argument of type '"superset_of"' is not assignable to parameter of type '"difficulty" | "name" | "supersetOf"'.(2345)

interface A<T = string> {
  name: T
}

const str: A = { name: 'zhangsan' }
const num: A<number> = { name: 18 }

T extends U ? X : Y

interface Dictionary<T = any> {
  [key: string]: T
}

type StrDict = Dictionary<string>

type DictMember<T> = T extends Dictionary<infer V> ? V : never

type StrDictMember = DictMember<StrDict>  // string

async function stringPromise() {
  return 'hello, zhangsan'
}

interface Person {
  name: string
  age: number
}

async function personPromise() {
  return { name: 'zhangsan', age: 30 } as Person
}

type PromiseType<T> = (args: any[]) => Promise<T>
type UnPromisify<T> = T extends PromiseType<infer U> ? U : never

type extractStringPromise = UnPromisify<typeof stringPromise>  // string
type extractPersonPromise = UnPromisify<typeof personPromise>  // Person

type Keys = 'a' | 'b' | 'c'

// => { a: any, b: any, c: any }
type Obj = {
  [p in Keys]: any
}

interface Person {
  name: string
  age: number
}

const sem: Person = { name: 'zhangsan', age: 18 }

function toArray(x: number): Array<number> {
  return [x]
}

type Sem = typeof sem       // => Person
type Func = typeof toArray  // => (x: number) => Array<number>

class Greeter {
  static message = 'hello'
  greet() {
    return Greeter.message
  }
}

// 获取的是实例的类型，该类型可以获取实例对象上的属性或方法
let greeter1: Greeter = new Greeter()
greeter1.greet()  // 'hello'


// 获取的是类的类型，该类型可以获取类上面的静态属性或方法
let greeterTwo: typeof Greeter = Greeter
greeterTwo.message = 'hey'

let greeter2: Greeter = new greeterTwo()
greeter2.greet()  // 'hey'

type ParamType<T> = T extends (param: infer P) => any ? P : T

type ParamType<T> = T extends (param: infer P) => any ? P : T

interface User {
  name: string
  age: number
}

type Func = (user: User) => void

type Param = ParamType<Func>  // Param = User
type AA = ParamType<string>   // string

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

type Func = () => User
type Test = ReturnType<Func> // Test = User

type Constructor = new (...args: any[]) => any

// 获取参数类型
type ConstructorParameters<T extends new (...args: any[]) => any> = T extends new (...args: infer P) => any ? P : never

// 获取实例类型
type InstanceType<T extends new (...args: any[]) => any> = T extends new (...args: any[]) => infer R ? R : any

class TestClass {
  constructor(public name: string, public age: number) { }
}

type Params = ConstructorParameters<typeof TestClass>  // [string, number]

type Instance = InstanceType<typeof TestClass>         // TestClass

interface Lengthwise {
  length: number
}

function identity<T extends Lengthwise>(arg: T): T {
  console.log(arg.length)
  return arg
}

// => 类型 `number` 的参数不能赋给类型 `Lengthwise` 的参数
identity(3)

// ❌
identity({ value: 3 })

// ✅
identity({ length: 10, value: 3 })

interface User {
  username: string
  id: number
  token: string
  avatar: string
  role: string
}

type UserWithoutToken = Omit<User, 'token'>

/**
 * node_modules/typescript/lib/lib.es5.d.ts
 * Make all properties in T optional
 */
type Partial<T> = {
  [P in keyof T]?: T[P]
}

interface Todo {
  title: string
  description: string
}

function updateTodo(todo: Todo, fieldsToUpdate: Partial<Todo>) {
  return { ...todo, ...fieldsToUpdate }
}

const todo1 = {
  title: 'title',
  description: 'description',
}

const todo2 = updateTodo(todo1, {
  description: 'update-description',
})

{
  title?: string | undefined
  description?: string | undefined
}

/**
 * node_modules/typescript/lib/lib.es5.d.ts
 * Construct a type with a set of properties K of type T
 */
type Record<K extends keyof any, T> = {
  [P in K]: T
}

interface PageInfo {
  title: string
}

type Page = 'home' | 'about' | 'contact'

const x: Record<Page, PageInfo> = {
  about: { title: 'about' },
  contact: { title: 'contact' },
  home: { title: 'home' }
}

/**
 * node_modules/typescript/lib/lib.es5.d.ts
 * From T, pick a set of properties whose keys are in the union K
 */
type Pick<T, K extends keyof T> = {
  [P in K]: T[P]
}

interface Todo {
  title: string
  description: string
  completed: boolean
}

type TodoPreview = Pick<Todo, 'title' | 'completed'>

const todo: TodoPreview = {
  title: 'home',
  completed: false
}

interface Test {
  arr: string[]
}

// 返回的结果 => {arr: string[]}
let aaa: Pick<Test, 'arr'> = { arr: ['1'] }

/**
 * node_modules/typescript/lib/lib.es5.d.ts
 * Exclude from T those types that are assignable to U
 */
type Exclude<T, U> = T extends U ? never : T

type T0 = Exclude<'a' | 'b' | 'c', 'a'>                      // 'b' | 'c'
type T1 = Exclude<'a' | 'b' | 'c', 'a' | 'b'>                // 'c'
type T2 = Exclude<string | number | (() => void), Function>  // string | number

/**
 * node_modules/typescript/lib/lib.es5.d.ts
 * Obtain the return type of a function type
 */
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any

type T0 = ReturnType<() => string>                              // string
type T1 = ReturnType<(s: string) => void>                       // void
type T2 = ReturnType<<T>() => T>                                // {}
type T3 = ReturnType<<T extends U, U extends number[]>() => T>  // number[]
type T4 = ReturnType<any>                                       // any
type T5 = ReturnType<never>                                     // any
type T6 = ReturnType<string>                                    // ❌
type T7 = ReturnType<Function>                                  // ❌

class FirstClass {
  id: number | undefined
}

class SecondClass {
  name: string | undefined
}

class GenericCreator<T> {
  create(): T {
    // ❌
    return new T()
  }
}

const creator1 = new GenericCreator<FirstClass>()
const firstClass: FirstClass = creator1.create()

const creator2 = new GenericCreator<SecondClass>()
const secondClass: SecondClass = creator2.create()

'T' only refers to a type, but is being used as a value here.

interface Point {
  new(x: number, y: number): Point
}

ConstructSignature: new TypeParametersopt(ParameterListopt) TypeAnnotationopt

new C
new C ( ... )
new C < ... > ( ... )

An object type containing one or more construct signatures is said to be a constructor type.
Constructor types may be written using constructor type literals or by including construct signatures in object type literals.

new < T1, T2, ... > ( p1, p2, ... ) => R

{ new < T1, T2, ... > ( p1, p2, ... ) : R }

// 构造函数类型字面量
new (x: number, y: number) => Point

{
  new (x: number, y: number): Point
}

interface Point {
  new(x: number, y: number): Point
  x: number
  y: number
}

class Point2D implements Point {
  readonly x: number
  readonly y: number

  constructor(x: number, y: number) {
    this.x = x
    this.y = y
  }
}

const point: Point = new Point2D(1, 2)

Class 'Point2D' incorrectly implements interface 'Point'.

Type 'Point2D' provides no match for the signature 'new (x: number, y: number): Point'.

interface Point {
  x: number
  y: number
}

interface PointConstructor {
  new(x: number, y: number): Point
}

class Point2D implements Point {
  readonly x: number
  readonly y: number

  constructor(x: number, y: number) {
    this.x = x
    this.y = y
  }
}

function newPoint(
  pointConstructor: PointConstructor,
  x: number,
  y: number
): Point {
  return new pointConstructor(x, y)
}

const point: Point = newPoint(Point2D, 1, 2)

class GenericCreator<T> {
  create<T>(c: { new(): T }): T {
    return new c()
  }
}

create<T>(c: { new(a: number): T }, num: number): T {
  return new c(num)
}

class FirstClass {
  id: number | undefined
}

class SecondClass {
  name: string | undefined
}

class GenericCreator<T> {
  create<T>(c: { new(): T }): T {
    return new c()
  }
}

const creator1 = new GenericCreator<FirstClass>()
const firstClass: FirstClass = creator1.create(FirstClass)

const creator2 = new GenericCreator<SecondClass>()
const secondClass: SecondClass = creator2.create(SecondClass)