TypeSript9 命名空间namesapce

我们在工作中无法避免全局变量造成的污染,TypeScript提供了namespace 避免这个问题出现

  • 内部模块,主要用于组织代码,避免命名冲突。
  • 命名空间内的类默认私有
  • 通过 export 暴露
  • 通过 namespace 关键字定义

TypeScript与ECMAScript 2015一样,任何包含顶级import或者export的文件都被当成一个模块。相反地,如果一个文件不带有顶级的import或者export声明,那么它的内容被视为全局可见的(因此对模块也是可见的)

ok,让我们看一个小例子

命名空间中通过export将想要暴露的部分导出

如果不用export 导出是无法读取其值的

namespace a {

export const Time: number = 1000

export const fn = <T>(arg: T): T => {

return arg

}

fn(Time)

}

namespace b {

export const Time: number = 1000

export const fn = <T>(arg: T): T => {

return arg

}

fn(Time)

}

a.Time

b.Time

嵌套命名空间

namespace a {

export namespace b {

export class Vue {

parameters: string

constructor(parameters: string) {

this.parameters = parameters

}

}

}

}

let v = a.b.Vue

new v('1')

抽离命名空间

a.ts

export namespace V {

export const a = 1

}

b.ts

import {V} from '../observer/index'

console.log(V);

//{a:1}

简化命名空间

namespace A {

export namespace B {

export const C = 1

}

}

import X = A.B.C

console.log(X);

合并命名空间

TypeSript10 模块学习-CSDN博客

相关推荐
kyriewen2 天前
别再对着 TypeScript 报错发呆了:我把 10 个最常见的红色波浪线翻译成了人话
前端·javascript·typescript
妙码生花2 天前
现代前端的极致性能 icon 加载方案(死磕成功版)
前端·vue.js·typescript
MonkeyKing3 天前
鸿蒙ArkTS深度剖析:ArkTS与TS/JS核心差异、静态强类型实战优势
typescript·harmonyos
Momo__4 天前
TypeScript satisfies 操作符——比 as 更安全的类型守门员
前端·typescript
Awu12275 天前
⚡从零开发 Agent CLI(四):给 CLI 装上"LLM 引擎"
typescript·ai编程·claude
假如让我当三天老蒯7 天前
TypeScript 继续学习(学习用)
前端·面试·typescript
糖拌西瓜皮7 天前
Node.js工程化实践:包管理、TypeScript配置与代码质量
typescript·node.js
Bolt9 天前
TypeScript 7.0 来了:当 tsc 用 Go 重写之后
javascript·typescript·go
Flynt10 天前
装上TypeScript 7.0 RC之后,最让我意外不是10倍提速
typescript·visual studio code
疯狂SQL10 天前
手写高性能在线 JSON 工具|Web Worker 工程化打包 + 语法自动修复 + 多语言代码生成实战
typescript·json·next.js·web worker·前端性能优化·esbuild·源码实战