• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript入门笔记(四)

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

上篇

在项目根目录中新建一个./module的文件夹,在里面创建如下ts文件。

文件:Validation.ts

1
// 例,Validation.ts文件作为一个模块(module) 2 // 使用export关键字将接口“StringValidator”暴露给外界 3 4 export interface StringValidator { 5 isAcceptable(s: string): boolean; 6 }
 文件名:ZipCodeValidator.ts

1
/* 2 * ///<reference path="./Validation.ts" /> 这种引入模块的写法是老版本的,不建议继续使用 3 * */ 4 5 // 使用import关键字将Validation文件中的StringValidator引入 6 import {StringValidator} from "./Validation"; //导入文件中的StringValidator接口 7 8 const numberRegexp = /^[0-9]+$/; 9 10 export class ZipCodeValidator implements StringValidator { 11 isAcceptable(s: string) { 12 return s.length === 6 && numberRegexp.test(s); 13 } 14 }
 文件名:TelValidator.ts

1
//还有一种引入的写法如下,把这个文件用以“validator”作为命名空间导入 2 import validator = require('./Validation'); 3 4 let telReg = /^(13[0-9]|15[0-9]|18[0-9])\d{8}$/; 5 6 export class TelValidator implements validator.StringValidator { 7 isAcceptable(s: string) { 8 return telReg.test(s); 9 } 10 }
 文件:ParseIntBasedZipCodeValidator.ts

1
// 也可以使用这种写法,类似python的引入写法,并给这个模块起别名 2 import * as validator from "./Validation"; 3 4 //使用别名就可以“点”出来模块中export暴露出来的内容 5 export class ParseIntBasedZipCodeValidator implements validator.StringValidator{ 6 isAcceptable(s: string) { 7 return s.length === 5 && parseInt(s).toString() === s; 8 } 9 } 10 11 // 导出原先的验证器但做了重命名 12 export {StringValidator as ValidatorBase} from "./Validation";

命名空间

文件名:University.ts
 1 /**
 2  * 命名空间,关键字“namespace”
 3  * 很多编程语言中都有这个概念,大家都是类似的作用
 4  */
 5 
 6 export namespace Earth {
 7 
 8     export class Person {
 9         planet: string = "地球";
10         constructor(readonly name: string, readonly age: number) {
11         }
12 
13         SayHi(): void {
14             console.log(`我是${this.name},我来自${this.planet}`)
15         }
16     }
17 }
18 
19 export namespace Mars {
20 
21     export class Person {
22         planet: string = "火星";
23         constructor(readonly name: string, readonly age: number) {
24         }
25 
26         SayHi(): void {
27             console.log(`我是${this.name},我来自${this.planet}`)
28         }
29     }
30 }
 1 import * as university from "./University"
 2 
 3 //使用命名空间区分同名类
 4 let earther = new university.Earth.Person("小明", 28);
 5 let marser = new university.Mars.Person("哈努纳汉", 342);
 6 
 7 earther.SayHi();    //我是小明,我来自地球
 8 marser.SayHi();     //我是哈努纳汉,我来自火星
 9 
10 //注意一点,这段代码在浏览器中运行会报错,是因为不支持“export”这个用法,但是在控制台使用nodejs执行是可以正常调用的,如果想在浏览器中运行可以使用webpack

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
Typescript的优缺点和面试题发布时间:2022-07-18
下一篇:
TypeScript - Classes发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap