您好,欢迎来到伴沃教育。
搜索
您的当前位置:首页TS声明文件(.d.ts文件)及 declare 关键字

TS声明文件(.d.ts文件)及 declare 关键字

来源:伴沃教育

.ts 文件与 .d.ts 文件介绍

  • .ts 文件,既包含类型信息又包含可执行代码。可以被编译成 .js 文件。
  • .d.ts 文件,只包含类型信息的类型声明文件。不会生成 .js 文件,仅用于提供类型信息。

ts 的代码最后会编译成 .js 的 js 代码供他人使用,这个时候,类型信息就丢失了,所以 ts 编译器会自动根据 .ts 中的信息,生成对外的 .d.ts 文件,和生成的 js 文件搭配使用。

  • js 文件是给运行引擎用的
  •  .d.ts 文件是给 IDE(智能编辑器)写代码时参考用的
  • 如果要为 js 库提供类型信息,要用 .d.ts 文件

.d.ts 声明文件说明

tips:

  • d.ts 文件中的所有类型(类型别名和接口除外)及变量都要使用 declare 定义,或者使用 export 将其导出,否则会抛出错误
  • .d.ts 文件顶级声明 declare 最好不要跟 export 同级使用,不然在其他ts引用这个 .d.ts 的内容的时候,就需要手动 import 导入了
  • .d.ts文件里如果顶级声明不用export的话,declare 和直接写 type、interface 效果是一样的,在其他地方都可以直接引用

declare 关键字 

  • declare关键字可以描述变量、type或者interface命令声明的类型、class、Enum、函数、模块和命名空间。
  • declare 是描述 TS 文件之外信息的一种机制,它的作用是告诉 TS 某个类型或变量已经存在,不用给出具体实现。比如只描述函数的类型,不给出函数的实现,如果不使用declare,是做不到的。
  • declare 只能用来描述已经存在的变量和数据结构,不能用来声明新的变量和数据结构。另外所有 declare 语句都不会出现在编译后的文件里面。

declare 声明模块,这样,我们可以在ts中引入相关的文件而不报错了

declare module '*.css';
declare module '*.less';
declare module '*.png';

declare 声明一个变量,对于引入第三方的库特别有效

declare var jQuery: (selector: string) => any;
// 声明变量直接使用
jQuery("#box")

在声明文件中 type 与 interface 也可以不用加 declare ,效果相同

type myType = string | number;
// 两者效果相同
declare type myType = string | number;

PS:目前的三大框架如果是用脚手架搭建的,已经不再需要手动去写这几行代码了,框架本身帮写好了。比如 Umi 创建的项目的 src/typings.d.ts

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- bangwoyixia.com 版权所有 湘ICP备2023022004号-2

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务