如何为JavaScript工具库编写正确的TypeScript类型定义？-js教程-PHP中文网

如何为JavaScript工具库编写正确的TypeScript类型定义？

花韻仙語

发布： 2025-02-27 19:36:50

原创

685人浏览过

如何为JavaScript工具库编写正确的TypeScript类型定义？

typescript类型定义与javascript工具库集成详解

本文探讨如何为JavaScript工具库编写正确的TypeScript类型定义文件（.d.ts）。我们将以一个名为single-promises的JavaScript工具库为例，分析并解决类型定义方面的问题。

该工具库的核心函数singlePromise接受一个函数fn和可选参数opt作为输入。fn函数可以返回任意类型的值，singlePromise函数旨在将fn的返回值（无论是Promise还是普通值）包装成一个Promise。同时，singlePromise还需提供update和clear方法管理缓存。

以下是解决方案：

LuckyCola工具库

LuckyCola工具库是您工作学习的智能助手，提供一系列AI驱动的工具，旨在为您的生活带来便利与高效。

查看详情

<code class="typescript">interface SingleOptions {
    cache?: number;
}

interface SingleFunc<P extends any[], T extends unknown> {
    (...args: P): T extends Promise<unknown> ? T : Promise<T>;
    update(opt?: SingleOptions): void;
    clear(): void;
}

export function singlePromise<P extends any[], T extends unknown>(
    fn: (...args: P) => T,
    opt?: SingleOptions
): SingleFunc<P, T>;</code>

登录后复制

代码定义了两个接口：SingleOptions描述singlePromise函数的可选参数；SingleFunc描述singlePromise函数返回的函数类型，它接受参数P，返回类型T，并包含update和clear方法。singlePromise函数的类型声明确保了输入和输出的类型安全。关键在于T extends Promise<unknown> ? T : Promise<t></t></unknown>，它优雅地处理了fn函数返回值是Promise还是普通值的情况，保证最终返回的始终是Promise。通过此类型定义，TypeScript编译器能够更好地理解和校验singlePromise函数的用法，提升代码的可维护性和可靠性。