TypeScript 命名空间整理

╰+攻爆jí腚メ 2022-06-13 10:38 189阅读 0赞

一、介绍

1.命名空间主要用于组织代码，以便于在记录他们类型的同时还担心与其他对象命名冲突。

2.和C\#一样，命名空间可以分离到多个文件

二、单个文件中

namespace Valid1 {
        export interface StringValidator {
            isAcceptable(s: string): boolean;
        }
        const lettersRegexp = /^[A-Za-z]+$/;
        const numberRegex = /^[0-9]+$/;
    
        export class LettersOnlyValidator implements StringValidator {
            isAcceptable(s: string) {
                return lettersRegexp.test(s);
            }
        }
    
        export class ZipCodeValidator implements StringValidator {
            isAcceptable(s: string) {
                return s.length === 5 && numberRegex.test(s);
            }
        }
    }
    
    //使用命名空间下的内容
    let strings =['Hello','98052','101'];
    let validators:{[s:string]:Valid1.StringValidator;}={};
    validators['Zip code']=new Valid1.ZipCodeValidator();
    validators['Letters only']=new Valid1.LettersOnlyValidator();
    
    //遍历字符串，遍历验证器
    for(let s of strings){
        for(let name in validators){
            console.log(`${s}--${validators[name].isAcceptable(s)?"matches":"does not match"}>${name}`);
        }
    }

三、多个文件中

1.接口文件IString.ts

namespace Valid2{
        export interface StringValidator{
            isAcceptable(s:string):boolean;
        }
    }

2.LettersOnlyValidator.ts文件

/// <refrences path="IString.ts" />
    namespace Valid2{
        const lettersRegexp=/^[A-Za-z]+$/;
        export class LettersOnlyValidator implements StringValidator{
            isAcceptable(s:string){
                return lettersRegexp.test(s);
            }
        }
    }

3.ZipCodeValidator.ts文件

/// <refrences path="IString.ts" />
    namespace Valid2 {
        const numberRegexp = /^[0-9]+$/;
        export class ZipCodeValidator implements StringValidator {
            isAcceptable(s: string) {
                return s.length === 5 && numberRegexp.test(s);
            }
        }
    }

4.测试文件

/// <refrences path="IString.ts" />
    /// <refrences path="LetersOnlyValidator.ts" />
    /// <refrences path="ZipCodeValidator.ts" />
    namespace test3 {
        let strings = ['Hello', '98052', '101'];
        let validators: { [s: string]: Valid2.StringValidator; } = {};
        validators['ZipCode'] = new Valid2.ZipCodeValidator();
        validators['LettersOnly'] = new Valid2.LettersOnlyValidator();
    
        for (let s of strings) {
            for (let name in validators) {
                console.log(`${s}--${validators[name].isAcceptable(s) ? "matches" : "does not match"}---->${name}`);
            }
        }
    }

5.测试页面

说明：

1.引用其他文件命名空间，使用：/// <reference path="Validation.ts" />  
2.命名空间文件生成，第一种，单独文件生成，使用时，按顺序引用，就像本实例；第二种，可以将相同命名空间合并到一个文件生成

四、使用别名

别名可以简化命名空间的使用。

语法：import q = x.y.z

namespace Shapes {
        export namespace Polygons {
            export class Triangle { }
            export class Square { }
        }
    }
    
    import polygons = Shapes.Polygons;
    let sq = new polygons.Square(); // Same as "new Shapes.Polygons.Square()"

注意，我们并没有使用 `require` 关键字，而是直接使用导入符号的限定名赋值。 这与使用  `var` 相似，但它还适用于类型和导入的具有命名空间含义的符号。 重要的是，对于值来讲，  `import` 会生成与原始符号不同的引用，所以改变别名的 `var` 值并不会影响原始变量的值。

五、命名空间和模块 对比说明

1.命名空间使用

命名空间位于全局命名空间下的一个普通的带有名字的JavaScript对象。这令命名空间十分容易使用。

但就像他的全局命名空间污染一样，它很难识别组件之间的依赖关系，尤其是在大型的项目中。

2.使用模块

像命名空间一样，模块可以包含代码的声明。不同的是模块可以声明它的依赖。

模块会把依赖添加到模块加载器上（例如CommonJS/Require.js）。模块也提供了更好的代码重用，更强的封闭性以及更好的使用工具进行优化。

对于NodeJs应用来说，模块是默认并推荐的阻止代码的方式。

一个js文件对应一个模块。

3.对于模块引用应使用导入import操作。

对于命名空间或外部模块使用`/// <reference>`引用模块文件

4.不应该对模块使用命名空间，使用命名空间为了提供逻辑分组和避免命名冲突。模块文件本身已经是一个逻辑分组，并且他的名字是有导入这个模块的代码指定，所以没必要为导出的对象增加额外的模块层。

[TypeScript模块整理（三）使用其他JavaScript库][TypeScript_JavaScript]

[TypeScript模块整理（二）编译生成][TypeScript]

[NodeJs之TypeScript开发环境--VS Code][NodeJs_TypeScript_--VS Code]

[TypeScript_JavaScript]: http://blog.csdn.net/u011127019/article/details/74316156
[TypeScript]: http://blog.csdn.net/u011127019/article/details/74280086
[NodeJs_TypeScript_--VS Code]: http://blog.csdn.net/u011127019/article/details/74297819