当前位置：首页 > wzjs >正文

湖北网站定制开发价格表深圳龙岗网站建设公司

wzjs 2025/9/9 20:09:18

湖北网站定制开发价格表,深圳龙岗网站建设公司,网站开发完成如何上线,网站ip流量查询在 TypeScript 中，namespace 是一种将代码组织到逻辑组中的方式。它主要用于避免全局命名空间污染，并帮助开发者更好地组织和管理代码。尽管现代 TypeScript 开发中更推荐使用模块（import/export），但在某些场景下&…

在 TypeScript 中，namespace 是一种将代码组织到逻辑组中的方式。它主要用于避免全局命名空间污染，并帮助开发者更好地组织和管理代码。尽管现代 TypeScript 开发中更推荐使用模块（import/export），但在某些场景下（尤其是旧项目或需要兼容性时），namespace 仍然有其用途。

我的理解是， namespace 相当与模块化的思想，因为那时候 js 的 module 还没有出来，所以 ts 出了这种功能，不过现在随着 js （import/export）的出现，namespace 尽量不要使用了，只是如果在一些以前的项目中看到，可以作为了解。

通过 namespace 我们引用其他文件的方式为

/// <reference path="路径" />

要主要前面有三个 ///

下面我举个例子，来看一下代码和应用

我现在在同一目录下有4个文件，分别是 hello.ts，trim.ts，测试.html，tsconfig.json，还有一个文件夹 dist

trim.ts：

namespace Greeter {export const value = 'Hello, World!'
}

hello.ts：

/// <reference path="trim.ts" />
namespace Greeter {export function trimFun() {console.log(`${value}, World!`)}
}Greeter.trimFun()

测试.html：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>测试的页面</h1><script src="./dist/bundle.js"></script>
</body></html>

tsconfig.json：

{"compilerOptions": {"module": "none","target": "ES5","outFile": "./dist/bundle.js"}
}

之后，我们在当前目录中打开终端，输入 tsc，然后打开html文件

可以看到，我们在 hello.ts 中使用了 trim.ts 中定义的一个 value 值

namespace 使用值得主要的是

export 关键字用于导出命名空间中的成员，使其可以在命名空间外部访问。
如果没有用 export，命名空间中的成员是私有的，无法从外部访问。

下面来说说 Namespace 和 Module 的一些区别：

特性	Namespace	Module
文件范围	全局范围	文件范围
导入/导出机制	手动引用 (`/// <reference path="..."/>`)	使用 `import`/`export`
推荐使用场景	旧项目或小型脚本	现代 TypeScript 项目
是否会污染全局命名空间	是	否