这种语法是js什么语法？<T>() => {}

Question

前端小白一个，基础掌握不牢。在阅读vue3源码过程中，发现如下代码（看样子是泛型）：

export const remove = <T>(arr: T[], el: T) => {
  const i = arr.indexOf(el)
  if (i > -1) {
    arr.splice(i, 1)
  }
}

有人能帮忙解释一下这个语法吗？
<T>(arr: T[], el: T) => {}
1.<T>前面没有名称？
2.<T>紧跟后面的小括号为什么这样写(arr: T[], el: T)
3.需要看哪些基础内容？如详细的文档和文章介绍等

Answer 1

这是 TypeScript 的泛型语法，不是 JS 语法。Vue3 是用 TypeScript 写的。

<T>(arr: T[], el: T) => {}

整个是一个泛型函数声明，<T> 是定义类型参数 T；类型参数在实际使用的时候决定是什么类型，比如

var list = ["hello", "world", "hi];
remove(list, "hi") // 这里会推导出 T 是 string 类型
// 也可以显示指定类型参数调用：
remove<string>(list, "hi")

() => {} 是一个 Lambda 声明，这个倒是 JS 有的语法，官方名称叫箭头函数。

(...) 括号中的类型是参数列表，TS 与 JS 的不同在于，参数有类型声明。(arr: T[], el: T) 表示第一个参数是 T[]，也就是 T 的数组类型；而 el 是 T 类型。

关于箭头函数，上面已经给了连接。如果想学习 TypeScript，容我打个广告，我录制的视频教程：

TypeScript从入门到实践 【2021 版】