TypeScript 泛型-泛型类型

最新推荐文章于 2023-08-30 09:15:18 发布

IT 哈

最新推荐文章于 2023-08-30 09:15:18 发布

阅读量1.7k

点赞数

分类专栏： TypeScript

原文链接：https://www.jianshu.com/p/7ccd1814da69

版权

TypeScript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

源码

//声明一个泛型类型的函数
function  Hello<T>(arg:T):T {
    return arg;
}
//声明一个方法该方法引用上面的泛型类型的函数
let myHello:<T>(arg:T) => T = Hello;
alert(myHello('xiaochuan'));

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TypeScript 泛型-泛型类型</title>
</head>
<body>
    <script type="text/javascript" src="GenericsDemo.js"></script>
</body>
</html>

浏览器效果图

image.png

扩展

Lam.ts

//简单的解释 => 表达式
//myFunc 函数名称  +  参数类型  + 返回值类型
//后面是定义这个函数的内容  参数必须是 number 类型 返回值也必须是 string 类型
// let myFunc:(a:number) => string = function(a:number):string{
//  return 'hello' + a;
// }
//实际上在后面定义函数实际内容的时候其本身就有 函数检查  所以其实可以将这个函数写成如下所示的样子
let myFunc = function(a:number):string{
    return 'hello' + a;
}
alert(myFunc(2));

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TypeScript 泛型-泛型类型</title>
</head>
<body>
    <!-- <script type="text/javascript" src="GenericsDemo.js"></script> -->
    <script type="text/javascript" src="Lam.js"></script>
</body>
</html>

浏览器效果图

image.png

使用另一种方法实现示例一的功能

// //声明一个泛型类型的函数
function  Hello<T>(arg:T):T {
    return arg;
}
// //声明一个方法该方法引用上面的泛型类型的函数
// let myHello:<T>(arg:T) => T = Hello;
// alert(myHello('xiaochuan'));


//使用另一种写法实现上面的定义
let myHello:{<T>(arg:T):T} = Hello;
alert(myHello('xiaochuan'));

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TypeScript 泛型-泛型类型</title>
</head>
<body>
    <script type="text/javascript" src="GenericsDemo.js"></script>
    <!-- <script type="text/javascript" src="Lam.js"></script> -->
</body>
</html>

浏览器效果图

image.png

下面是在接口中泛型的使用

//下面是在接口中对泛型的使用
//定义一个有一个泛型函数的接口
interface Hello{
    //定义一个泛型的函数
    <T>(arg:T):T;
}
//声明一个泛型函数
function myHello<T>(arg:T):T{
    return arg;
}
//声明一个引用 Hello 接口类型的函数 函数的值引用 myHello 函数
let MH:Hello = myHello;
// alert(MH('xiaochuan'));//这样并没有用到泛型
//下面是使用泛型的好处的实现
alert(MH<string>('xiaochuan'));

HTML 与上例一致
浏览器效果图

image.png

下面是在接口中对泛型使用的另一种写法

//下面是在接口中对泛型使用的另一种写法
//在接口定义的时候就指定其为泛型
interface Hello<T>{
    (arg:T):T;
}
//声明一个泛型函数
function myHello<T>(arg:T):T{
    return arg;
}
//声明一个引用自接口且为 number 类型的函数
let mh:Hello<number> = myHello;
//这样的话这个参数就只能是 number 类型
alert(mh(29));

HTML 与上例相同
浏览器效果图

image.png

IT 哈

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
TypeScript 泛型-泛型类型

源码ts//声明一个泛型类型的函数function Hello<T>(arg:T):T { return arg;}//声明一个方法该方法引用上面的泛型类型的函数let myHello:<T>(arg:T) => T = Hello;alert(myHello('xiaochuan'));HTML<!DOCTYPE html...
复制链接

扫一扫