这是我参与11月更文挑战的第21天,活动详情查看:2021最后一次更文挑战
回顾前面学习记录: 学习了 TS 的枚举类型/interface接口/Class类, 简单 本文来学习 TS 重要概念--泛型 generics
现在 TypeScript + Vue3
应用特别广了, 如果不学习, 总感觉跟不上大厂的步伐了. 学习 TypeScript
(虽然觉得也是可选的,但还是要学,真卷...) 这里记录学习 TypeScript
的过程, 收录在 TypeScript 实战专栏
Typescript 相关文档
Typescript 官网地址: typescriptlang.org/zh/
Typescript 中文文档--泛型:generics-泛型
TypeScript 泛型
理解 什么是泛型:
泛型可以理解为宽泛的类型,通常用于类和函数
泛型的学习理解:
我们先看两个函数:
function returnSimpleType (arg: number): number {
return arg
}
这里函数返回值为 number类型和参数arg的类型一致, 但是如果这个参数arg 是一个 string字符串类型呢? 如下:
function returnSimpleType (arg: string): string {
return arg
}
上面这俩函数 传递的参数的类型和函数返回的类型是一样的, 也就是书写逻辑是一样的, 重复性的代码要都这么写就很鸡肋了,
所以在 TypeScript 中有这么一个变量 T
, 可以理解为它表示函数传入的参数的类型, 然后函数返回的类型也用它表示.即它只表示类型而不是值
function returnSimpleType<T>(arg: T): T {
return arg
}
如上代码所示: 在 TypeScript 中这个类型变量就叫做 泛型.
Vue3 学习实战系列更文:
- Vue3 源码学习-工具函数 utils(二)
- Vue3-初体验,
- Vue3-
生命周期
和setup()函数
, - Vue3-
computed & watch
, - Vue3-
Teleport
改变组件挂载的根节点, - Vue3-
Suspense
处理异步请求, - Vue3-
defAsyncComponent
异步组件(新增), - Vue3-
fragments
(新增), - Vue3-
v-model
(非兼容),
- Vue3 源码仓库
vue-next
: github.com/vuejs/vue-n… - Vue3.x 官方中文文档: v3.cn.vuejs.org