typescript 声明文件

作用

1、为已存在js库提供类型信息,这样在ts项目中使用这些库时候,就像用ts一样,会有代码提示、类型保护等机制

2、项目内共享类型:如果多个.ts文件中都用到同一个类型,此时可以创建.d.ts文件提供该类型,实现类型共享。

有哪些

内置的类型声明文件:
TS为JS运行时可用的所有标准化内置API都提供了声明文件
像window、document 等 BOM、DOM API 也都有相应的类型声明
第三方库的类型声明:
正常导入该库,TS就会自动加载库自己的类型声明文件

如何编写类型声明文件

类型声明文件中只能有类型定义 和 类型声明,不能包含其他执行代码

1、实现一个项目内共享类型文件

export type CustomArray = (number | string)[]
export type AddFunc = (a: number, b: number) => void
export interface PersonConfig {age: number,name: string,say(): void
}
// 下面代码会报错
//function add() {
//  console.log(1);
//}

然后再其他用到这些类型的地方引入即可

2、为已存在js库提供类型信息
将js迁移到ts 或者 创建的js库给别人的ts项目使用时候,可以提供类型声明文件
在导入.js文件时,TS会自动加载与.js同名的.d.ts文件,以提供类型声明。
对于let、function等具有双重含义(在JS、TS中都能用),应该使用declare 关键字,明确指定此处用于类型声明。
在这里插入图片描述
// 类型提供好以后,需要使用模块化方案中提供的模块化语法,来导出声明好的类型。
// 然后,才能在其他的.ts 文件中使用
// 如果没有导出,即使js文件导出了,但是声明文件没有导出,在ts当中也是没法使用的

// 类型定义并且导出 在需要用到的地方需要导入才能用
export type CustomArray = (number | string)[]
export type AddFunc = (a: number, b: number) => void
export interface PersonConfig {age: number,name: string,say(): void
}// 类型声明 同文件名会被自动导入 
declare let a: number;
declare function add(a: number): void;// 类型提供好以后,需要使用模块化方案中提供的模块化语法,来导出声明好的类型。
// 然后,才能在其他的.ts 文件中使用
// 也可以导出 自定义类型(如果需要使用到的话)
export { a, add, CustomArray, AddFunc, PersonConfig }

用法

1、被通过import导入,使用其中暴露的类型定义和变量声明。

2、和相关模块关联,为模块进行类型声明。

对于第二种用法,声明文件如何同相关模块关联呢?

比如有个第三方包名字叫"foo",那么TypeScript会在node_modules/foo中根据其package.json的types和typing字段查找库自带的声明文件查找到的声明文件被作为该模块的声明文件;
TypeScript也会在node_modules/@types/foo/目录中查找声明文件,如果能找到就被作为foo模块的声明文件;
TypeScript还会在我们的项目中查找.d.ts文件,如果遇到declare module 'foo’语句,则该声明被用作foo模块的声明。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/76529.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

web文件上传

文件上传指的是&#xff0c;将本地的图片、视频、音频上传到服务器&#xff0c;提供给其他用户浏览和下载的过程 前端需求 想要进行文件上传对于web前端来说有三个重要要素 1.<input type"file" name"image"> 提供这样的file文件上传格式 2. metho…

定位服务器CPU爆满的具体原因

1、查询CPU消耗的进程 使用top命令查看系统的CPU和内存使用情况 CPU一列是线程占用百分比 2、具体查看某个占分比大的进程 以为PId:7355为例&#xff0c; 执行top -Hp 7355&#xff0c;线程按照CPU使用率排序。 3、将线程PID转化为16进制 执行printf %x 7391&#xff0c;将…

Kubernetes 使用 Rancher 管理

K8S集群管理工具 只能管理单个K8S集群 kubectl命令行管理工具 dashboard&#xff08;K8S官方的UI界面图形化管理工具&#xff09; &#xff08;管理多集群很麻烦&#xff0c;切换不同集群每次需要更改kube-config文件[kubectl配置文件]&#xff0c;如果kubeadm部署每次都需…

k8s 认证和权限控制

k8s 的认证机制是啥&#xff1f; 说到 k8s 的认证机制&#xff0c;其实之前咋那么也有提到过 ServiceAccouont &#xff0c;以及相应的 token &#xff0c;证书 crt&#xff0c;和基于 HTTP 的认证等等 k8s 会使用如上几种方式来获取客户端身份信息&#xff0c;不限于上面几种…

Segment Anything论文阅读笔记

Segment Anything论文阅读笔记 1. Segment Anything论文基本信息2. Segment Anything论文阅读2.1 第一遍阅读 Segment Anything2.2. 第二遍阅读 Segment Anything2.2.1. Segment Anything中相关的图表 1. Segment Anything论文基本信息 论文地址https://arxiv.org/abs/2304.02…

构建高可用的去中心化微服务集群架构指南

随着云计算、大数据和物联网的快速发展&#xff0c;企业对于可扩展的、高性能的微服务架构的需求也日益增长。传统的集中式架构已经不能满足这些需求&#xff0c;因此出现了去中心化的微服务集群架构。本文将介绍如何构建高可用的去中心化微服务集群架构&#xff0c;以满足企业…

虚幻官方项目《CropOut》技术解析 之 程序化岛屿生成器(IslandGenerator)

开个新坑详细分析一下虚幻官方发布的《CropOut》&#xff0c;文章会同步发布到我在知乎|CSDN的专栏里 文章目录 概要Create Island几何体生成部分随机种子Step 1Step 2Step 3Step 4Step 5Step 6 岛屿材质部分动态为草地设置颜色 程序设计的小技巧其它Platform Switch函数 概要 …

pdf格式文件下载不预览,云存储的跨域解决

需求背景 后端接口中返回的是pdf文件路径比如&#xff1a; pdf文件路径 &#xff08;https://wangzhendongsky.oss-cn-beijing.aliyuncs.com/wzd-test.pdf&#xff09; 前端适配是这样的 <ahref"https://wangzhendongsky.oss-cn-beijing.aliyuncs.com/wzd-test.pdf&…

记录首次面试2023-08-18

人生第一次面试&#xff0c;大概一个小时左右。没有问我C的&#xff0c;上来一个数据库事务&#xff0c;虽然没有复习&#xff0c;但是还是能够记住一些&#xff0c;主要问的一些事务的隔离级别&#xff0c;以及都有什么作用&#xff0c;我是举例回答的&#xff0c;客户端A和客…

PHP加密与安全的最佳实践

PHP加密与安全的最佳实践 概述 在当今信息时代&#xff0c;数据安全是非常重要的。对于开发人员而言&#xff0c;掌握加密和安全的最佳实践是必不可少的。PHP作为一种常用的后端开发语言&#xff0c;提供了许多功能强大且易于使用的加密和安全性相关函数和类。本文将介绍一些P…

网络编程面试笔试题

一、OSI 7层模型&#xff0c;TCP/IP 4层模型 5层模型。 以及每一层的功能&#xff08;重点&#xff1a;第三层 第四层&#xff09; 答&#xff1a; 7层模型&#xff08;①物理层&#xff1a;二进制比特流传输&#xff0c;②数据链路层&#xff1a;相邻结点的可靠传输&#xf…