• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Typescript-泛型

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

原文:TypeScript基本知识点整理

 

零、序言

  很多时候,类型是写死的,不利于复用,泛型简单的理解就是声明时不设置具体类型,后期使用时再传入,解决类、接口、方法的复用性,以及对不特定数据类型的支持。

 

一、泛型函数

  函数在调用时,指定泛型 T 的类型

function f9<T>(value:T) : T {
    //传入参数类型为T,返回值的类型也为T
    console.log(`我传入了${value}`)
    return value
}

f9<number>(10)

function f10 <T> (value:T) : any {
    //传入参数的类型为T,返回任意类型的值
    console.log(`我返回了${value}`)
    return `我返回了${value}`
}

console.log(f10<string>('我是ljy'))

   这样方便的 地方在与:调用函数的时候, function f9<T>(value:T) : T   指定 <> 中的类型值后,编辑器就能把 value:T  以及返回值的 T 转换成指定的类型。

 

二、泛型类

  泛型类,使用  <> 跟在类名后面

class Ni <T> {
    name : T
    constructor (name : T) {
        this.name = name
    }
    say (value : T) : any {

        return `${this.name}说${value}`
    }
}

const ni1 = new Ni<string>('ljy')//实例化类,指定类的类型是string
console.log(ni1.say('你好'))

const ni2 = new Ni<number>(20)//实例化类,指定类的类型是number
console.log(ni2.say(23))

 

  顺便贴一个 java 中 ArrayList  泛型的案例:

List<String> stringArrayList = new ArrayList<String>();

 

三、泛型接口

第一种形式:

interface Niniubi {
    <T> (value:T) : any
}

let fff : Niniubi = <T>(value : T) : any => {
    return `我传入了${value}`
}
console.log(fff<number>(25))
console.log(fff<string>('ljy'))

 

第二种形式:

interface ConfigFnTwo<T>{
    (value:T):T;
}
function setDataTwo<T>(value:T):T{
    return value
}
var setDataTwoFn:ConfigFnTwo<string> = setDataTwo
setDataTwoFn('name');

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript 中的顶级类型:any 和 unknown发布时间:2022-07-18
下一篇:
vue+typescript构建项目发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap