美文网首页
模块的声明

模块的声明

作者: 叶向晚77 | 来源:发表于2017-01-14 15:09 被阅读0次

使用module关键字来定义模块,并在末尾加花括号即可用; 用export关键字使接口、类等成员对模块外可见。

moduleValidation{//定义模块

  exportinterfaceStringValidator{//声明接口对外部可以使用

  isAcceptable(s:string):boolean;

}

varlettersRegexp=/^[A-Za-z]+$/;

varnumberRegexp=/^[0-9]+$/;

exportclassLettersOnlyValidatorimplementsStringValidator{//声明类对外部可用

   isAcceptable(s:string){

  returnlettersRegexp.test(s);

     }

}

exportclassZipCodeValidatorimplementsStringValidator{

           isAcceptable(s:string){

          returns.length===5&&numberRegexp.test(s);

 }

}

}

在模块声明完成以后,我们就可以调用这个模块了,调用模块中的接口、类、方法等。调用方法简单,就是用模块名后面跟一个点来调用类、接口、方法等。

varstrings=['Hello','98052','101'];

varvalidators:{[s:string]:Validation.StringValidator;}={};

validators['ZIP code']=newValidation.ZipCodeValidator();//使用模块中的类

validators['Letters only']=newValidation.LettersOnlyValidator();

// 显示匹配结果

for(vari=0;i

for(varnameinvalidators){

document.write('"'+strings[i]+'" '+(validators[name].isAcceptable(strings[i])?' matches ':' does not match ')+name+"
");// 使用方法

}

}

分隔模块到多个文件:随着我们项目的扩展,我们的代码总不可能只写在一个文件里。为了更好地维护项目,我们会将特定功能放到一个文件里,然后加载多个文件实现我们想需要的功能。现在我们先将上面的代码分割到多个文件里。

Validation.ts

moduleValidation{

exportinterfaceStringValidator{

isAcceptable(s:string):boolean;

}

}

LettersOnlyValidator.ts

///

moduleValidation{

varlettersRegexp=/^[A-Za-z]+$/;

exportclassLettersOnlyValidatorimplementsStringValidator{

isAcceptable(s:string){

returnlettersRegexp.test(s);

}

}

}

ZipCodeValidator.ts

///

moduleValidation{

varnumberRegexp=/^[0-9]+$/;

exportclassZipCodeValidatorimplementsStringValidator{

isAcceptable(s:string){

returns.length===5&&numberRegexp.test(s);

}

}

}

Test.ts

varstrings=['Hello','98052','101'];

varvalidators:{[s:string]:Validation.StringValidator;}={};

validators['ZIP code']=newValidation.ZipCodeValidator();

validators['Letters only']=newValidation.LettersOnlyValidator();

for(vari=0;i

for(varnameinvalidators){

document.write('"'+strings[i]+'" '+(validators[name].isAcceptable(strings[i])?' matches ':' does not match ')+name+"
");//调用类的方法

}

}

在项目中新建好以上四个文件,然后我们编译项目,如果我们代码编写没错的话,是能够编译通过的。另外,我们可以见到后面三个文件开头有类似于 C# 的文档注释,这是告诉TypeScript编译器该文件依赖于哪些文件,假如依赖的文件不存在的话,编译就会不通过。当然我们不写也是可以的,只不过编译器在编译时不会帮我们检查,一般来说,还是建议写上。 另外,在引用编译生成的 JavaScript 文件时,我们需要注意好顺序。以上面的代码为例,我们在 Html 代码中已经这么引用。

相关文章

  • 模块的声明

    使用module关键字来定义模块,并在末尾加花括号即可用; 用export关键字使接口、类等成员对模块外可见。 m...

  • 06

    模块的声明和调用 获取一个模块 require(一个js文件是一个模块或类) exports 声明一个模块 mod...

  • TS 中的模块声明

    我们知道,当我们写了一个 JS 模块,在 TS 中是不能直接使用的,我们必须为此模块编写声明文件,也就是编写 xx...

  • 产品前端架构 4——技术选型

    1.模块化 模块 模块组织指的是 JS 脚本的模块组织 模块职责:封装实现,暴露接口,声明依赖 模块系统 模块系统...

  • Option Explicit

    Option Explicit意思是:在模块级别中使用,强制显式声明模块中的所有变量,即变量只有声明后才能使用。 ...

  • typescript 声明文件及模块解析

    转:声明文件转:模块解析

  • Java平台模块系统(1)- 模块声明

    在提到Java 9时,最重要的话题是Project Jigsaw,也就是Java平台模块系统(Java Platf...

  • module.exports用法

    module.exports 对象是由模块系统创建的。在我们自己写模块的时候,需要在模块最后写好模块接口,声明这个...

  • 终于讲清楚了nodejs中exports和module.expo

    module.exports 对象是由模块系统创建的。在我们自己写模块的时候,需要在模块最后写好模块接口,声明这个...

  • React-Native, ES5和ES6写法的区别总结

    引入模块的不同 组件声明不同 this的指向

网友评论

      本文标题:模块的声明

      本文链接:https://www.haomeiwen.com/subject/gpvebttx.html