上一章TypeScript教程请查看:TypeScript模块
名称空间名称空间是用于对功能进行逻辑分组的一种方式。它允许我们以更简洁的方式组织代码。名称空间可以包括接口、类、函数和变量,以支持一组相关功能。
与JavaScript不同,名称空间内嵌在TypeScript中。在JavaScript中,变量声明进入全局范围。如果在同一个项目中使用多个JavaScript文件,则可能会用类似的名称覆盖新用户,从而造成混淆。因此,使用TypeScript命名空间消除了命名冲突。
名称空间可以跨多个文件,并且允许使用“——outFile”连接每个文件,因为它们都是在一个地方定义的。
名称空间声明
文件名: StoreCalc.ts
namespace invoiceCalc {
export namespace invoiceAccount {
export class Invoice {
public calculateDiscount(price: number) {
return price * .60;
}
}
}
}
访问名称空间
///<
reference path="./StoreCalc.ts"/>
let invoice = new invoiceCalc.invoiceAccount.Invoice();
console.log("Output: "" +invoice.calculateDiscount(400));
模块模块是一种创建一组相关变量、函数、类和接口等的方法。它在本地范围内执行,而不是在全局范围内执行。换句话说,在模块中声明的变量、函数、类和接口不能在模块外部直接访问。我们可以使用export关键字创建模块,也可以在其他模块中使用import关键字。
模块通过使用模块加载器导入另一个模块。在运行时,模块加载器负责在执行模块之前定位和执行模块的所有依赖项。JavaScript中最常用的模块加载器是用于Node.js的CommonJS模块加载器和用于Web应用程序的require.js模块加载器。
文章图片
模块声明
文件名: addition.ts
export class Addition{
constructor(private x?: number, private y?: number){
}
Sum(){
console.log("SUM: " +(this.x + this.y));
}
}
【TypeScript名称空间和模块的区别 – TypeScript开发教程】访问模块
import {Addition} from './addition';
let addObject = new Addition(10, 20);
addObject.Sum();
模块 VS 名称空间
编号 | 模块 | 名称空间 |
1. | 模块是一种将代码组织在单独文件中的方法,可以在它们的本地范围内执行,而不是在全局范围内执行。 | 名称空间是一种使用局部作用域对功能进行逻辑分组的方法。 |
2. | 模块使用export关键字公开模块功能。 | 我们可以使用namespace关键字创建名称空间,并且可以使用export关键字在花括号{}中定义所有接口、类、函数和变量。 |
3. | 模块中的所有导出函数和类都可以在模块外部访问。 | 我们必须为函数和类使用export关键字,以便能够在名称空间之外访问它。 |
4. | 我们可以使用import关键字在其他模块中使用模块。 | 名称空间必须通过使用三重斜杠(///)引用语法包含在文件中。如。 |
5. | 它也被称为外部模块。 | /// < reference path=” path to namespace file” /> |
6. | 我们可以使用“——module”命令来编译模块。 | 它也被称为内部模块。 |
7. | 模块通过使用模块加载器API来导入另一个模块,该API是在编译时指定的,例如CommonJS, require。js等。 | 我们可以使用“——outFile”命令编译名称空间。 |
8. | 模块可以声明它们的依赖关系。 | 在命名空间中,不需要模块加载器。在HTML页面中使用< script> 标记包含名称空间的.js文件。 |
9. | 在模块中,我们可以使用它们的原始名称或重命名它们,从而重新导出它们的一些特性。 | 名称空间不能声明它们的依赖项。 |
10. |
模块声明: FileName: addition.ts export class Addition{ constructor(private x?: number, private y?: number){ } Sum(){ console.log(“ SUM: ” +(this.x + this.y)); } } 访问模块: import {Addition} from ‘ ./addition’ ; let addObject = new Addition(10, 20); addObject.Sum(); |
名称空间声明: FileName: StoreCalc.ts namespace invoiceCalc { export namespace invoiceAccount { export class Invoice { public calculateDiscount(price: number) { return price * .60; } } } } 访问名称空间: ///< reference path=” ./StoreCalc.ts” /> let invoice = new invoiceCalc.invoiceAccount.Invoice(); console.log(“ Output: “ ” +invoice.calculateDiscount(400)); |
推荐阅读
- TypeScript使用泛型编程 – TypeScript开发教程
- TypeScript模块(内部模块和外部模块 – TypeScript开发教程)
- TypeScript使用名称空间 – TypeScript开发教程
- TypeScript类的继承介绍 – TypeScript开发教程
- TypeScript类的用法详解 – TypeScript开发教程
- TypeScript三种函数参数解析 – TypeScript开发教程
- TypeScript函数重载 – TypeScript开发教程
- TypeScript箭头函数用法详解 – TypeScript开发教程
- TypeScript函数使用详解 – TypeScript开发教程