zoukankan      html  css  js  c++  java
  • [TypeScript] Infer the Return Type of a Generic Function Type Parameter

    When working with conditionals types, within the “extends” expression, we can use the “infer” keyword to either get the type of the elements of an array, or even to get the return type of a function. We can use this to build a “FnReturnType” type, that will give us the return type of the function passed in as the generic parameter.

    infer: Typescript can tell the type by itself:

    // typescript knows its return type is number
    function generateId(seed: number) { 
        return seed + 5
    }
    
    // typescript knows its return type is string
    function generateId(seed: number) { 
        return seed + "5"
    }

    If we have one function, its param type is depend on another function's return type, to make type safety, we have to use Unit type:

    function generateId(seed: number) { 
        return seed + "5"
    }
    function lookupEntity(id: string | number ) { 
    } 
    lookupEntity(generateId(3))

    This works, but not good enough, because, unit type can be huge when it grows... 

    So better typescript can infer the return type and change based on that, to do that we can use conditional type again:

    type CustomReturnType<T> = T extends (...args: any[]) => infer U ? U : never;
    type Id = CustomReturnType<typeof generateId>;
    
    function generateId(seed: number) { 
        return seed + "5"
    }
    function lookupEntity(id: string | number ) { 
    } 
    lookupEntity(generateId(3))

    So 'CustomReturnType should be the infer return type, return type is String then it is String, if number then it is number.

    function generateId(seed: number) { 
        return seed + "5"
    }
    type Id = CustomReturnType<typeof generateId>; // Id is string
    
    function generateId(seed: number) { 
        return seed + 5
    }
    type Id = CustomReturnType<typeof generateId>; // Id is number

    Now we can use Id type as param's type:

    type Id = CustomReturnType<typeof generateId>;
    
    function lookupEntity(id: Id ) { 
    } 

    Actually TypesScript already build it 'ReturnType', works the same the 'CustomReturnType' we just build.

    type Id = ReturnType<typeof generateId>;
    
    function lookupEntity(id: Id ) { 
    } 

    Knowing this, it is usefully to build a nested infer type:

    type UnpackPromise<T> = T extends Promise<infer K>[] ? K : any;
    const arr = [Promise.resolve(true)];
    
    type ExpectedBoolean = UnpackPromise<typeof arr>; // Able to know that the value we passed into the promise is boolean
  • 相关阅读:
    NSSelectorFromString 使用示例
    NSClassFromString 实例话静态库中的类
    iOS Simulator hang up ( Xcode4.6.3)
    RabbitMQ 相关概念和方法详解
    Python pika, TypeError: exchange_declare() got an unexpected keyword argument 'type' 问题修复
    巧用 git rebase 将某一部分 commit 复制到另一个分支
    巧用 git rebase 合并多个 commit。
    分享常用的GoLang包工具
    Laradock使用教程(新手版)
    PHP中抽象类与接口的区别
  • 原文地址:https://www.cnblogs.com/Answer1215/p/10316574.html
Copyright © 2011-2022 走看看