• TypeScript——泛型


    定义:不预先确定的数据类型,具体的类型在使用的时候才能确定

    好处:1.函数和类可以支持多种类型,增加的程序的可扩展性
               2.不必写多条函数重载,联合类型声明,增强代码的可读性
               3.灵活控制类型之间的约束 

    这里可以 把泛型理解为代表类型的参数

    • 泛型函数

    // 泛型函数
    function log<T>(value: T): T {
        return value
    }
    log<string[]>(['a','b']) // 根据约束的类型带入函数
    log(['a',2]) // 可通过TS自身的类型推断
    
    // 用类型别名来实现泛型函数
    type Log = <T>(value: T) => T
    let mylog: Log = log // 具体实现可指定到log函数
    • 泛型接口

    interface Log1 {
        <T>(value: T): T // 与类型别名方式等价
    }
    interface Log2<T> { // 当泛型变量约束整个接口的话,实现时必须指定一个类型
        (value: T): T 
    }
    let mylog1: Log2<number> = log
    mylog1(1)
    • 泛型类

    看上去与泛型接口差不多。 泛型类使用( <>)括起泛型类型,跟在类名后面。

    class Log3<T> {
        run(value: T) {
            console.log(value)
            return value
        }
    }
    let log1 = new Log3<number>()
    log1.run(1)
    let log2 = new Log3() // 当不指定参数类型,则可以传入任意类型
    log2.run('a') 
    • 泛型约束

    interface Length {
        length: number
    }
    function log<T extends Length>(value: T): T {
        console.log(value, value.length)
        return value
    }
    log([]) // 有length属性即可调用
    log('11')
    log({length: 1})

    总结
      泛型不仅可以保持类型的一致性,又不失程序的灵活性,同时也可以通过泛型约束,控制类型之间的约束。从代码的上来看,可读性,简洁性,远优于函数重载,联合类型声明以及 any 类型的声明。

  • 相关阅读:
    es6-箭头函数
    高度自适应的div
    移动端css水平垂直居中
    跨域2-常用的跨域方式
    跨域1-CORS跨域
    前端路由分类
    K8S系列-2.常用命令
    Git多分支管理
    微服务-01初识
    VirtualBox虚拟Centos磁盘文件扩容
  • 原文地址:https://www.cnblogs.com/JessieXie/p/12384938.html
Copyright © 2020-2023  润新知