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博客

相关推荐
Dragon Wu17 小时前
Electron Forge集成React Typescript完整步骤
前端·javascript·react.js·typescript·electron·reactjs
We་ct1 天前
LeetCode 56. 合并区间:区间重叠问题的核心解法与代码解析
前端·算法·leetcode·typescript
程序猿阿伟2 天前
《TypeScript中Protobuf到运行时类型安全的转换指南》
javascript·安全·typescript
We་ct2 天前
LeetCode 228. 汇总区间:解题思路+代码详解
前端·算法·leetcode·typescript
阿蒙Amon2 天前
TypeScript学习-第10章:模块与命名空间
学习·ubuntu·typescript
VT.馒头2 天前
【力扣】2695. 包装数组
前端·javascript·算法·leetcode·职场和发展·typescript
AAA阿giao3 天前
从零拆解一个 React + TypeScript 的 TodoList:模块化、数据流与工程实践
前端·react.js·ui·typescript·前端框架
hedley(●'◡'●)3 天前
基于cesium和vue的大疆司空模仿程序
前端·javascript·vue.js·python·typescript·无人机
百锦再3 天前
Vue高阶知识:利用 defineModel 特性开发搜索组件组合
前端·vue.js·学习·flutter·typescript·前端框架
小杨同学呀呀呀呀3 天前
Ant Design Vue <a-timeline>时间轴组件失效解决方案
前端·javascript·vue.js·typescript·anti-design-vue