[ts基础] 如何编写一个typescript 声明文件(xxx.d.ts)

最新推荐文章于 2024-06-14 16:41:21 发布

BeSill

最新推荐文章于 2024-06-14 16:41:21 发布

阅读量8k

点赞数 2

分类专栏： typescript

本文链接：https://blog.csdn.net/weixin_40438455/article/details/103779838

版权

TypeScript大势所趋，前端主流的库及互联网公司都纷纷转向TypeScript的怀抱，但是在公司内部有些公共的JS 库，并不支持类型系统，并且已经在线上运行了很长时间，在用ts从0开始在写一遍显然是不大现实的，TypeScript 身为 JavaScript 的超集，自然需要考虑到如何让 JS 库也能定义静态类型。TypeScript先后提出了几种解决方案，最终确定了DefinitelyTy...

摘要由CSDN通过智能技术生成

前置知识

1、类型声明文件
xxx.d.ts

2、作用
我们在ts中使用非ts编写的类库，必须为这个类库编写类型声明文件，对外暴露他的API，否则无法使用

3、类库种类

全局库通过 <script> 标签引入的第三方库
模块库 ES6 模块规范
umd库既可以通过 <script> 标签引入，又可以通过import 导入

开启你的第一个类型声明文件

在Typescript中，我们编写一个类型声明文件相对来说还是很容易的
下面咱们实现一个全局库的类型声明文件

js code

// src/fristModule.js
const name = 'colin'
function sayHello() {
   
	console.log('hello world!!!');
}
function Cat() {
   
	console.log(`my name is ${
     name}`)
}
Cat.sayHello = sayHello

// src/index.ts
// 调用Cat函数 如果不写类型描述的话 vs code中会为我们提示出来，如下图所示，并且在编译的时候ts编译器会报错
Cat.sayHello();

在这里插入图片描述
类型声明文件 fristModule.d.ts

// src/fristModule.d.js
declare function Cat(): void;

declare namespace Cat {
   
  function sayHello(): void
}

html文件index.html

// index.html
<!DOCTYPE html>
<html lang="en">
<head>

最低0.47元/天解锁文章

BeSill

关注

2
点赞
踩
17

收藏

觉得还不错? 一键收藏
0
评论
[ts基础] 如何编写一个typescript 声明文件(xxx.d.ts)

TypeScript大势所趋，前端主流的库及互联网公司都纷纷转向TypeScript的怀抱，但是在公司内部有些公共的JS 库，并不支持类型系统，并且已经在线上运行了很长时间，在用ts从0开始在写一遍显然是不大现实的，TypeScript 身为 JavaScript 的超集，自然需要考虑到如何让 JS 库也能定义静态类型。TypeScript先后提出了几种解决方案，最终确定了DefinitelyTy...
复制链接

扫一扫

专栏目录