ts文件引入js文件_如何编写一个d.ts文件的步骤详解

前言

本文主要讲怎么写一个typescript的描述文件(以d.ts结尾的文件名，比如xxx.d.ts)。

最近开始从js转ts了。但是要用到一些描述文件(d.ts)，常用的比如jquery等都可以通过 npm下载到别人已经写好的npm install @types/jquery。但是还是有一些小众的或者公司内部的公共库或者以前写过的公用js代码需要自己手动写描述文件。

之前也从网上面也找了一些资料，但还是看的云里雾里模糊不清，经过一段摸索，将摸索的结果记录下来，也希望可以给别人一个参考。

如果你只写js，d.ts对你来说也是有用的，大部分编辑器能识别d.ts文件，当你写js代码的时候给你智能提示。效果像这样：

通常，我们写js的是时候有两种引入js的方式：

1，在html文件中通过

2，通过模块加载器require其他js文件：比如这样var j=require('jquery')。

全局类型

首先以第一种方式举例。

变量

比如现在有一个全局变量，那对应的d.ts文件里面这样写。

declare var aaa:number

其中关键字declare表示声明的意思。全局变量是aaa,类型是数字类型(number)。当然了也可以是string类型或者其他或者：

declare var aaa:number|string //注意这里用的是一个竖线表示"或"的意思

如果是常量的话用关键字const表示：

declare const max:200

函数

由上面的全局变量的写法我们很自然的推断出一个全局函数的写法如下：

/** id是用户的id，可以是number或者string */

decalre function getName(id:number|string):string

最后的那个string表示的是函数的返回值的类型。如果函数没有返回值可以用void表示。

在js里面调用的时候就会提示：

我们上面写的注释，写js的时候还可以提示。

有时候同一个函数有若干种写法：

get(1234)

get("zhangsan",18)

那么d.ts对应的写法：

declare function get(id: string | number): string

declare function get(name: