TypeScript学习记录

函数签名

函数签名指的是函数的声明或者定义中包含的信息,主要包括函数的参数类型、参数个数、返回类型等。函数签名定义了函数的形状,是函数类型的一部分。

在 TypeScript 或者 JavaScript 中,函数签名包括以下几个要素:

  1. 参数列表: 指定了函数接受的参数的数量和类型。

  2. 返回类型: 指定了函数调用后返回的值的类型。

  3. 函数名: 表示函数的名称。

下面是一个简单的 TypeScript 函数签名的例子:

复制代码
// 函数签名
type AddFunction = (a: number, b: number) => number;

// 使用函数签名定义具体的函数
const add: AddFunction = (x, y) => x + y;

// 调用具体的函数
const result = add(3, 5);
console.log(result); // 输出: 8

在这个例子中:

  • AddFunction 是一个函数类型,它的函数签名表示这个函数接受两个参数,都是 number 类型,返回值是一个 number 类型。

  • add 是一个使用了 AddFunction 类型的具体函数,它接受两个参数并返回它们的和。

函数签名有助于提供类型安全性,因为 TypeScript 可以在编译时检查函数的使用是否符合其定义。这也是 TypeScript 中强大的类型系统的一部分。

泛型类型

泛型类型是一种在编程中使用的抽象类型,它允许你定义一个类型占位符,在实际使用时再指定具体的类型。在 TypeScript 中,泛型类型可以应用于函数、类、接口等,提供更灵活和可重用的代码结构。

泛型类型使用尖括号 <T> 来表示,其中 T 是一个占位符,代表类型参数。你可以在定义泛型类型时使用 T 或其他合适的字母或单词。以下是一些示例:

①泛型函数类型

复制代码
type IdentityFunction<T> = (arg: T) => T;

// 使用泛型类型
const echo: IdentityFunction<string> = (arg) => arg;
const duplicate: IdentityFunction<number> = (arg) => arg * 2;

②泛型类类型:

复制代码
class Box<T> {
    private value: T;

    constructor(value: T) {
        this.value = value;
    }

    getValue(): T {
        return this.value;
    }
}

// 使用泛型类
const stringBox = new Box<string>("Hello");
console.log(stringBox.getValue()); // 输出: Hello

const numberBox = new Box<number>(42);
console.log(numberBox.getValue()); // 输出: 42

③泛型接口类型:

复制代码
interface Pair<T, U> {
    first: T;
    second: U;
}

// 使用泛型接口
const pair1: Pair<number, string> = { first: 1, second: "two" };
const pair2: Pair<string, boolean> = { first: "hello", second: true };

这些例子中的 T 是泛型类型参数,它表示一个占位符,具体的类型将在使用时提供。泛型类型提供了一种更通用、可重用的方式来定义函数、类、接口等,使得代码更灵活,能够适应不同的数据类型。

相关推荐
濮水大叔9 小时前
在大型 Vue 项目中,如何有效管理复杂的状态?“散装版” vs “套装版”
前端·vue.js·typescript
谷哥的小弟1 天前
TypeScript数组类型
javascript·typescript
退休倒计时1 天前
【每日一题】LeetCode 199. 二叉树的右视图 TypeScript
算法·leetcode·typescript
前端之虎陈随易2 天前
编程语言级别的Skill市场,AI Agent 的未来形态
前端·vue.js·人工智能·typescript·node.js
后台开发者Ethan3 天前
类型分类、联合类型、交叉类型
typescript
鹰影473 天前
一款AI笔记助手和远程同步的markdown笔记idea-note
人工智能·笔记·rust·typescript·react
想你依然心痛3 天前
AtomCode 在前端开发中的实战体验:React + TypeScript 项目开发实录
前端·react.js·typescript
疯狂的魔鬼3 天前
精确计算容器剩余视口高度:useAutoContainerFullHeight 的工程实践
前端·css·typescript
后台开发者Ethan3 天前
类型与变量
开发语言·typescript
孤狼warrior3 天前
从冒泡到传送带流水线:一个3D沉浸式算法靶场,让思想的伟力改变世界
python·算法·typescript