6.1分多个ts文件实现module块
Validation.ts代码
module Validation{ export interface StringValidator { isAcceptable(s: string): boolean;//是否接受. } } |
ZipCodeValidator.ts代码
/// <reference path="Validation.ts" /> module Validation { //匹配0-9的数字. var numberRegexp = /^[0-9]+$/;
export class ZipCodeValidator implements StringValidator { isAcceptable(s: string) { //如果长度=5并且是数字就返回一个true return s.length === 5 && numberRegexp.test(s); } } } |
LettersOnlyValidator.ts代码
/// <reference path="Validation.ts" /> module Validation { //匹配A-Z,a-z的英文 var lettersRegexp = /^[A-Za-z]+$/; export class LettersOnlyValidator implements StringValidator { isAcceptable(s: string) { return lettersRegexp.test(s); } }} |
test-1.ts代码
/// <reference path="../plugins/typescript/typings/jquery.d.ts" /> /// <reference path="test1/Validation.ts" /> /// <reference path="test1/LettersOnlyValidator.ts" /> /// <reference path="test1/ZipCodeValidator.ts" />
/*** * Splitting Across Files分割跨文件 */
// 声明一个数组. var strings = ['Hello', '98052', '101'];
// 使用这个验证. var validators: { [s: string]: Validation.StringValidator; } = {};
validators['Zip Code'] = new Validation.ZipCodeValidator();//这个是验证邮政编码 validators['Letters only'] = new Validation.LettersOnlyValidator();//这个是验证英文
function showMsg():void{
//显示每个字符串是否通过每个验证 strings.forEach(s => { for (var name in validators) {
console.log('"' + s + '" ' + (validators[name].isAcceptable(s) ? ' matches ' : ' does not match ') + name); $("#msg1").html('"' + s + '" ' + (validators[name].isAcceptable(s) ? ' matches ' : ' does not match ') + name); }//--for--end
});//--forEach--end }
$(document).ready(function(){ showMsg();
});
|
Html 文件
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="../../plugins/jquery-2.1.4.min.js"></script> <script src="../test1/Validation.js" type="text/javascript"></script> <script src="../test1/LettersOnlyValidator.js" type="text/javascript"></script> <script src="../test1/ZipCodeValidator.js" type="text/javascript"></script> <script src="../test-1.js" type="text/javascript"></script> </head> <body> <div id="msg1"></div> <br/> <div id="msg2"></div |