TS类型声明文件(二)如何在 TS 中导入导出局部类型

在TypeScript中,局部类型通常是指那些只在定义它们的文件或模块内部可用的类型。这些类型通过export关键字从定义它们的文件中导出,然后通过import关键字在需要它们的文件或模块中导入,多个函数或组件均可引用,避免了类型定义的重复。

1. 定义并导出局部类型

首先,你需要在一个文件中定义一个类型,并使用export关键字将其导出。这个文件可以是一个.ts(TypeScript)文件。

// 定义一个局部类型  
export type MyLocalType = {  
  name: string;  
  age: number;  
};

2. 导入局部类型

然后,在另一个文件中,你可以使用import语句来导入这个局部类型。这样,你就可以在导入它的文件中使用这个类型了。

// 导入局部类型  
import { MyLocalType } from './types';  

// 现在可以在这个文件中使用MyLocalType了  
const person: MyLocalType = {  
  name: 'John Doe',  
  age: 30
};    

console.log(person);

注意,在import语句中,你需要指定从哪个文件(或模块)导入类型,这通常是通过相对路径(如'./types')或绝对路径(如果是使用模块解析配置的话)来完成的。

3. 编译和运行

最后,配置 tsconfig.json 以便TypeScript编译器可以编译.ts文件,并生成相应的JavaScript文件,必要的话也可以配置compilerOptions.declaration 开启生成d.ts 文件。

注意事项

  • TypeScript的类型定义在编译成JavaScript时会被移除,所以JavaScript文件中不会有类型信息;

  • 确保你的项目中有TypeScript配置文件(tsconfig.json),以便编译器知道如何编译你的项目;

  • 当你使用importexport语句时,你实际上是在使用ES6模块系统(或CommonJS,取决于你的项目配置)。TypeScript支持这些模块系统,并允许你在类型级别上使用它们。

  • 局部类型只在它们被导出的文件中是“局部”的;一旦它们被导入到另一个文件中,它们就在那个文件的上下文中变得可用了。然而,从整个项目的角度来看,仍然是通过模块系统组织和管理的。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端后花园

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值