扩展全局声明
- 新建一个声明文件,如 a.d.ts
declare global{ interface Window{ globalConfig:any } } export {};
- export {}, 必须有导出语句;这是因为全局对象扩充语句必须在模块或外部模块声明中使用,当添加了空导出语句后,该文件就成了一个模块。
- window对象的类型为Window而不是window,注意区分大小写;
定义全局接口
- 在如 b.ts 文件内
interface Window{ globalConfig:any }
- 这里新定义 Window 接口会和 TS 中原同名接口进行合并
这两个文件的核心功能是定义了 globalConfig
属性作为 Window
对象的一部分,并且都使用了 TypeScript 的声明合并机制。尽管它们看起来相似,但有一些关键的区别:
文件a:declare global
的使用
declare global {
interface Window {
globalConfig: any;
}
}
export {};
- 声明全局:
declare global
用于在全局作用域中声明或扩展类型。在这个文件中,Window
接口被扩展(或修改),增加了globalConfig
属性。 - 适用场景:这种方式常用于扩展全局对象(如
window
、document
等)的类型定义。它的作用范围是在整个项目中,这意味着在任何地方都能识别window.globalConfig
,并且不需要在每个文件中显式地导入。 - 文件导出:
export {}
语句的作用是将文件标记为模块,这样declare global
才能生效。如果没有export {}
,这会被认为是一个脚本文件,而非模块文件,declare global
可能无法按预期工作。
文件b:直接定义 Window
接口
interface Window {
globalConfig: any;
}
声明接口:这种方式直接声明了
Window
接口的扩展,通常这种方式适用于在 TypeScript 中修改全局对象的类型定义,但它要求该文件是一个模块,或者在全局作用域中合适地引用。作用范围:该代码片段只会影响文件内部或通过显式导入该接口的其他模块。如果没有导入或没有特别处理,它不会自动作用于全局作用域(如在浏览器中访问
window.globalConfig
时)。这意味着它不像declare global
那样能够直接修改全局作用域的Window
类型。主要区别
作用域:
declare global
会修改全局Window
接口,影响整个项目。- 直接声明
interface Window
只会修改当前模块中的Window
类型,其他模块可能无法感知到这一变化。
文件用途:
declare global
用于在声明文件(.d.ts
)中扩展全局作用域类型。- 直接声明
interface Window
可能更常见于普通的 TypeScript 文件中。
总结
如果你需要在整个项目中修改 window
对象的类型并使其生效,那么使用 declare global
会更合适;如果只是希望在某个模块中修改 Window
类型,直接声明 interface Window
即可。