泛型数组
本课属于 Coddy JavaScript 学习旅程的“TypeScript 入门”单元。第 60 课,共 73 课。
数组和泛型在 TypeScript 中配合得非常好。之前学习带类型的数组时,你使用了 T[] 语法来指定数组只能包含特定类型的元素。泛型也能让你表达相同的概念。
TypeScript 还提供了使用 Array<T> 格式表示带类型数组的另一种语法:
// These two declarations are equivalent:
let numbers1: number[] = [1, 2, 3];
let numbers2: Array<number> = [1, 2, 3];在处理对数组进行操作的泛型函数时,Array<T> 语法特别有用。它能更明确地体现代码的泛型特性,让代码更易读,尤其是在创建可以处理任意类型数组,同时保证类型安全的函数时。
挑战
简单创建一个名为 getFirstElement 的泛型函数,它接受任意类型的数组,并返回第一个元素;如果数组为空,则返回 undefined。
这个函数应该:
- 使用泛型类型参数
T - 接受一个名为
arr、类型为Array<T>的参数 - 返回类型为
T的第一个元素,或undefined - 显式标注返回类型
T | undefined
使用 Array<T> 语法创建以下数组:
- 创建类型为
Array<string>的stringArray,包含["apple", "banana", "cherry"] - 创建类型为
Array<number>的numberArray,包含[10, 20, 30, 40] - 创建类型为
Array<boolean>的booleanArray,包含[true, false, true] - 创建一个为空的
Array<string>类型数组emptyStringArray
测试你的函数并打印以下输出:
- 打印使用
stringArray调用getFirstElement的结果 - 打印使用
numberArray调用getFirstElement的结果 - 打印使用
booleanArray调用getFirstElement的结果 - 打印使用
emptyStringArray调用getFirstElement的结果 - 打印使用包含
["single"]的新Array<string>调用getFirstElement的结果
亲手试试
// TODO: 在这里编写你的代码
// 创建泛型函数 getFirstElement
// 使用 Array<T> 语法创建所需的数组
// 测试函数并打印结果这节课包含一个小测验。开始学习即可作答,并记录你的进度。
TypeScript 入门中的所有课
自己练习: TypeScript 在线编辑器