当前位置: 首页 > news >正文

TS:.d.ts 文件 和 declare 的作用

  • 1 declare 做外部声明
    • 1.1 声明外部类型
    • 1.2 声明外部模块
      • 1.2.1 解决引入资源模块报错
      • 1.2.2 跳过对第三方库的类型检查
    • 1.3 声明外部变量
    • 1.4 声明外部命名空间(作用域)
  • 2 .d.ts 文件做外部声明
  • 3 declare global {} 在模块中做外部声明

先说一下我对 .d.ts文件 和 declare 的理解,.d.ts文件 和 declare 都是用来做 外部声明 的,而 .d.ts 文件做外部声明是 declare 做外部声明的简化形式。

备注:
我理解 外部声明 就是 声明全局类型或者模块,可以直接引用而不用去 import 或者 import type 相应的变量或者类型。

1 declare 做外部声明

如果 types.ts 文件在 ts 编译范围内的情况下,在 types.ts 文件中,通过 declare 声明的变量、类型或者模块是全局性的,即,可以在不导入类型的情况下直接使用。

1. 何为 types.ts 文件在 ts 编译范围内的情况下?
在 TS 配置文件(tsconfig.js)中,通过 include 选项设置的编译范围内包含 types.ts 文件。
2. 用 declarre 声明的变量、类型或者模块不能全局使用的情况?
types.ts 文件不能是模块,即,文件内不用有导入/导出语句(import,import type,export,export type)。如果文件中包含导入导出语句,types.ts 文件中的声明将失去全局性,必须导出声明,并在使用时先导入,否则会报错。

1.1 声明外部类型

// ajax 请求方式
declare type AjaxType = 'GET' | 'POST' | 'DELETE' | 'PUT' | 'PATCH';

1.2 声明外部模块

1.2.1 解决引入资源模块报错

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

此例中,不对导入的资源模块进行类型检查。如果不进行以上声明,导入 css/less/png 等资源文件时会提示编译错误。

1.2.2 跳过对第三方库的类型检查

declare module 'jquery';

如果想要使用一些用js 编写的第三方库,可以通过声明外部模块,跳过对第三方库的类型检查
此例中,jquery模块中所有成员的类型都成了any类型,这等同于不对jQuery进行类型检查。

1.3 声明外部变量

declare var a: boolean;
declare let b: boolean;
declare const c: boolean;

如果外部变量声明中没有使用类型注解,那么变量的类型为 any类型

这个什么情况下会用到呢?假如我在项目中引入了一个sdk,这个sdk(我们以微信的sdk为例)里面有一些全局的对象(比如wx),但是如果不经过任何的声明,在ts文件里面直接用wx.config()的话,肯定会报错。

declare就是告诉 TS编译器 你担保这些变量和模块存在,并声明了相应类型,编译的时候按照声明的类型进行类型检查,如果没有声明类型,默认是 any 类型。

1.4 声明外部命名空间(作用域)

declare namespace API {var a: boolean;let b: boolean;const c: boolean;function foo(bar: string, baz: boolean): void;
}

外部命名空间的成员默认为导出成员,不需要使用export关键字来明确地导出它们,但使用了export关键字也没有错误。

声明完之后在其他 ts文件中,就可以直接 API.xxx 引用。

2 .d.ts 文件做外部声明

和 declare 做外部声明一样, .d.ts 文件(例如:types.d.ts)在 ts 编译范围内,且 .d.ts 文件不是模块的情况下,文件中声明的变量、类型或者模块都是外部声明。只不过在 .d.ts 文件中的声明可以省略 declare。

// types.d.ts文件中
type PlainObjectType<T = any> = { [propType: string]: T };
// declare type PlainObjectType<T = any> = { [propType: string]: T };

以上两种声明,都是外部声明,效果相同。

注意
1. .d.ts 文件提供的声明仅在编译阶段有效
.d.ts 文件中只提供类型声明,不提供任何值,如字符串和函数实现等,在编译TypeScript程序的过程中,.d.ts文件 不会生成对应的 .js文件
2. .d.ts 文件不能是模块
.d.ts 文件不能是模块,即,文件内不用有导入/导出语句(import,import type,export,export type)。如果文件中包含导入导出语句,.d.ts 文件中的声明将失去全局性,必须导出声明,并在使用时先导入,否则会报错。

3 declare global {} 在模块中做外部声明

使用 declare global {} 可以实现在模块中做外部声明。以下示例中:
MainMenuType 类型 就是外部接口类型,在其他模块中不用引入就可以直接使用。
UserType 类型 在其他模块中需要引入才能使用。

import { createSlice } from '@reduxjs/toolkit';
import type { PayloadAction } from '@reduxjs/toolkit';declare global {interface MainMenuType {eventCode: string,businessCode: string,menuOrder: number,icon: string,menuId: string,menuPid: string,isMultiple: boolean,menuName: string,menuType: string,menuGroup: string,menuAttestWay: string,children?: MainMenuType[]}
}export interface UserType {common: PlainObjectType,mainMenus: MainMenuType[],[key: string]: any
}

相关文章:

TS:.d.ts 文件 和 declare 的作用

1 declare 做外部声明1.1 声明外部类型1.2 声明外部模块1.2.1 解决引入资源模块报错1.2.2 跳过对第三方库的类型检查 1.3 声明外部变量1.4 声明外部命名空间&#xff08;作用域&#xff09; 2 .d.ts 文件做外部声明3 declare global {} 在模块中做外部声明 先说一下我对 .d.ts文…...

JavaScript-jQuery2-笔记

1.获取元素文本、属性、内部结构、表单中的值 获取标签中所夹的文本内容&#xff1a;text() 获取标签的属性值&#xff1a;prop(属性名) 获取表单元素的内容&#xff1a;如 文本框中的内容 val() 获取元素的内部html结构&#xff1a;html() 2.筛选选择器 筛选选择器&#xff1…...

设计模式之多线程版本的if------Balking模式

系列文章目录 设计模式之避免共享的设计模式Immutability&#xff08;不变性&#xff09;模式 设计模式之并发特定场景下的设计模式 Two-phase Termination&#xff08;两阶段终止&#xff09;模式 设计模式之避免共享的设计模式Copy-on-Write模式 设计模式之避免共享的设计模…...

mybatis核心配置文件介绍

mybatis核心配置文件 1. properties配置介绍 properties标签&#xff1a;加载外部的资源配置文件 ​ 属性&#xff1a;resource 指定要引入的配置文件路径 ​ 在核心配置文件中&#xff0c;通过&#xff1a;${key}方式引入外部配置文件的数据 jdbc.peroperties 的文件内容…...

Linux完全卸载Anaconda3和MiniConda3

如何安装Anaconda3和MiniConda3请看这篇文章&#xff1a; 安装Anaconda3和MiniConda3_minianaconda3-CSDN博客文章浏览阅读474次。MiniConda3官方版是一款优秀的Python环境管理软件。MiniConda3最新版只包含conda及其依赖项如果您更愿意拥有conda以及超过720个开源软件包&…...

Apache Answer,最好的开源问答系统

Apache Answer是一款适合任何团队的问答平台软件。无论是社区论坛、帮助中心还是知识管理平台&#xff0c;你可以永远信赖 Answer。 目前该项目在github超过10K星&#xff0c;系统采用go语言开发&#xff0c;安装配置简单&#xff0c;界面清洁易用&#xff0c;且开源免费。项目…...

【C】内存分配

首先&#xff0c;回顾一下内存分配。所有程序都必须预留足够的内存来存储程序使用的数据。这些内存中有些是自动分配的&#xff1a; float x; int place[100]; 这些声明预留了足够的空间&#xff0c;还为内存提供了一个标识符&#xff0c;可以使用x或place识别数据。 1、mal…...

MySQL 从零开始:03 基本入门语句

文章目录 1、连接数据库1.1 命令提示符登陆1.2 MySQL 8.0 Command Line Client 登陆1.3 MySQL Workbench 登陆 2、基本语句2.1 查看所有库2.2 创建库2.3 删除库2.4 选择数据库2.5 查看表2.6 创建表2.7 删除表2.8 改表名2.9 清空表 在上一小节中介绍了 MySQL 数据库的安装&#…...

井盖异动传感器,守护脚下安全

随着城市化进程的加速&#xff0c;城市基础设施的安全问题日益受到关注。其中&#xff0c;井盖作为城市地下管道的重要入口&#xff0c;其安全问题不容忽视。然而&#xff0c;传统的井盖监控方式往往存在盲区&#xff0c;无法及时发现井盖的异常移动。为此&#xff0c;我们推出…...

复合机器人作为一种新型的智能制造装备高效、精准和灵活的生产方式

随着汽车制造业的快速发展&#xff0c;对于高效、精准和灵活的生产方式需求日益增强。复合机器人作为一种新型的智能制造装备&#xff0c;以其独特的优势在汽车制造中发挥着越来越重要的作用。因此&#xff0c;富唯智能顺应时代的发展趋势&#xff0c;研发出了ICR系列的复合机器…...

重置 Docker 中 Gitlab 的账号密码

1、首先进入Docker容器 docker exec -it gitlab bash 2、连接到 gitlab 的数据库 需要谨慎操作 gitlab-rails console -e production 等待加载完后会进入控制台 ------------------------------------------------------------------------------------------------------…...

任务类型划分

以下内容来自于ChatGPT内存密集型应用和IO密集型应用是两种不同类型的计算应用&#xff0c;它们在资源需求和性能特点上有所不同。 内存密集型应用&#xff08;Memory-Intensive Applications&#xff09;&#xff1a; 特点&#xff1a; 这类应用主要依赖大量的内存资源来执行任…...

docker搭建部署mysql并挂载指定目录

Docker是一种轻量级、可移植的容器化平台&#xff0c;可以简化应用程序的部署和管理。在本文中&#xff0c;我们将探讨如何使用Docker来搭建和部署MySQL数据库&#xff0c;并将数据和配置文件挂载到外部目录&#xff0c;以实现数据持久化和方便的配置管理。 1: 安装Docker 首…...

即将推出的 OpenWrt One/AP-24.XY:OpenWrt 和 Banana Pi 合作路由器板

OpenWrt开发人员正在与Banana Pi合作开发OpenWrt One/AP-24.XY路由器板。OpenWrt 是一个轻量级嵌入式 Linux 操作系统&#xff0c;支持近 1,800 个路由器和其他设备。然而&#xff0c;这将是第一块由 OpenWrt 直接开发的路由器板。 该主板将基于 MediaTek MT7981B (Filogic 82…...

【uniapp-小程序-分享图5/4】

utils.js //裁剪分享的图片为5:4 const makeCanvas (imgUrl) > {console.log("imgUrl",imgUrl);return new Promise((resolve, reject) > {// 获取图片信息,小程序下获取网络图片信息需先配置download域名白名单才能生效uni.getImageInfo({src: imgUrl,succe…...

【响应式编程】前置知识和相关技术的总结

前置知识 这些概念都与响应式编程密切相关。&#x1f98c; 1. 并发和多线程编程&#xff1a;响应式编程需要处理并发性&#xff0c;它允许多个操作独立地并行执行。这使得应用程序可以在不同的线程、进程或设备上处理多个事件。 2. 事件驱动编程&#xff1a;响应式编程是一种…...

K8S--安装MySQL8(单机)

原文网址&#xff1a;K8S--安装MySQL8&#xff08;单机&#xff09;-CSDN博客 简介 本文介绍K8S部署MySQL8&#xff08;单机&#xff09;的方法。 ----------------------------------------------------------------------------------------------- 分享Java真实高频面试题…...

CMake+QT+大漠插件的桌面应用开发

文章目录 CMakeQT大漠插件的桌面应用开发说明环境项目结构配置编译环境代码 CMakeQT大漠插件的桌面应用开发 说明 在CMake大漠插件的应用开发——处理dm.dll&#xff0c;免注册调用大漠插件中已经说明了如何免注册调用大漠插件&#xff0c;以及做了几个简单的功能调用&#x…...

OpenCV-24双边滤波

一、概念 双边滤波对于图像的边缘信息能够更好的保存。其原理为一个与空间距离相关的高斯函数与一个灰度距离相关的高斯函数相乘。 空间距离&#xff1a;指的是当前点与中心点的欧式距离。空间域的高斯函数及其数学形式为&#xff1a; 其中&#xff08;xi&#xff0c;yi&…...

AI智能分析网关V4:太阳能+4G智慧水库远程可视化智能监管方案

一、背景需求分析 由于水库位置分散的原因&#xff0c;水库视频监控建设在立杆、布线等方面都存在一定的难度&#xff0c;且需要人力、物力的前期投入和后期维护。目前水库的监管存在一定的问题&#xff0c;管理人员工作强度大但管理质量并不高&#xff0c;人为巡检无法实时发…...

网络六边形受到攻击

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 抽象 现代智能交通系统 &#xff08;ITS&#xff09; 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 &#xff08;…...

Lombok 的 @Data 注解失效,未生成 getter/setter 方法引发的HTTP 406 错误

HTTP 状态码 406 (Not Acceptable) 和 500 (Internal Server Error) 是两类完全不同的错误&#xff0c;它们的含义、原因和解决方法都有显著区别。以下是详细对比&#xff1a; 1. HTTP 406 (Not Acceptable) 含义&#xff1a; 客户端请求的内容类型与服务器支持的内容类型不匹…...

边缘计算医疗风险自查APP开发方案

核心目标:在便携设备(智能手表/家用检测仪)部署轻量化疾病预测模型,实现低延迟、隐私安全的实时健康风险评估。 一、技术架构设计 #mermaid-svg-iuNaeeLK2YoFKfao {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg…...

【解密LSTM、GRU如何解决传统RNN梯度消失问题】

解密LSTM与GRU&#xff1a;如何让RNN变得更聪明&#xff1f; 在深度学习的世界里&#xff0c;循环神经网络&#xff08;RNN&#xff09;以其卓越的序列数据处理能力广泛应用于自然语言处理、时间序列预测等领域。然而&#xff0c;传统RNN存在的一个严重问题——梯度消失&#…...

高危文件识别的常用算法:原理、应用与企业场景

高危文件识别的常用算法&#xff1a;原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件&#xff0c;如包含恶意代码、敏感数据或欺诈内容的文档&#xff0c;在企业协同办公环境中&#xff08;如Teams、Google Workspace&#xff09;尤为重要。结合大模型技术&…...

HBuilderX安装(uni-app和小程序开发)

下载HBuilderX 访问官方网站&#xff1a;https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本&#xff1a; Windows版&#xff08;推荐下载标准版&#xff09; Windows系统安装步骤 运行安装程序&#xff1a; 双击下载的.exe安装文件 如果出现安全提示&…...

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

蓝桥杯3498 01串的熵

问题描述 对于一个长度为 23333333的 01 串, 如果其信息熵为 11625907.5798&#xff0c; 且 0 出现次数比 1 少, 那么这个 01 串中 0 出现了多少次? #include<iostream> #include<cmath> using namespace std;int n 23333333;int main() {//枚举 0 出现的次数//因…...

使用 SymPy 进行向量和矩阵的高级操作

在科学计算和工程领域&#xff0c;向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能&#xff0c;能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作&#xff0c;并通过具体…...

管理学院权限管理系统开发总结

文章目录 &#x1f393; 管理学院权限管理系统开发总结 - 现代化Web应用实践之路&#x1f4dd; 项目概述&#x1f3d7;️ 技术架构设计后端技术栈前端技术栈 &#x1f4a1; 核心功能特性1. 用户管理模块2. 权限管理系统3. 统计报表功能4. 用户体验优化 &#x1f5c4;️ 数据库设…...