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

TypeScript-命名空间

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
  • 命名空间可以看做是一个微型模块
  • 当我们想把相关的业务代码写在一起, 又不想污染全局空间的时候, 我们就可以使用 命名空间
  • 本质就是定义一个大对象, 把变量/方法/类/接口 ... 等,都放里面

命名空间和模块区别

  • 在程序内部使用的代码, 可以使用命名空间封装和防止全局污染
  • 在程序内部外部使用的代码, 可以使用模块封装防止全局污染
  • 总结: 由于模块也能实现相同的功能, 所以大部分情况下用模块即可

博主假设有这么一个需求: 定义一个检验传入的参数是否为 a-z 的功能。首先来分析一下该功能如果定义在当前 ts 文件当中会造成污染全局的问题,其实可以利用命名空间来解决该污染问题如下:

namespace Validation {
    const lettersRegexp = /^[A-Za-z]+$/;
    export const LettersValidator = (value) => {
        return lettersRegexp.test(value);
    }
}

console.log(Validation.LettersValidator('abc'));
console.log(Validation.LettersValidator(123));

如上代码需要注意的就是需要将外界需要使用的函数或者属性都需要通过 export 进行导出外界才可以进行调用,如上的命名空间我是定义在同一个 ts 文件当中的,那么没有定义在同一个文件当中该如何编写呢?首先需要创建一个 ts 文件来进行存储命名空间编写的功能性代码如下:

namespace Validation {
    const lettersRegexp = /^[A-Za-z]+$/;
    export const LettersValidator = (value) => {
        return lettersRegexp.test(value);
    }
}

然后在需要使用该命名空间的地方通过 /// <reference path="xxx"/> 的方式进行使用:

/// <reference path="./test.ts"/>
console.log(Validation.LettersValidator('abc'));
console.log(Validation.LettersValidator(123));

然后在通过 tsc --outFile index.js index.ts 来进行打包,打包之后的结果如下:

  • tsc --outFile:第一个参数为:打包之后的文件存储的位置
  • tsc --outFile:第二个参数为:需要打包哪个文件

鲜花

握手

雷人

路过

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

请发表评论

全部评论

专题导读
上一篇:
TypeScript入门-基本数据类型发布时间:2022-07-18
下一篇:
typescript(Day5)泛型发布时间: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