TS-06 模块、命名空间、声明合并
模块
ts1.5版本之后,内部模块称作命名空间,外部模块改称为模块;
ts中的模块都是使用es6的模块语法的,在es6模块中的基础上,ts还新增了其他的模块方法:
ts
// a.ts
const name = 'info'
export = name // 默认导出
// b.ts
import name = require('./b.ts') // 引入
模块的三种引入方式
ts
import moment from 'moment' // 导入了一个函数
import * as moment from 'moment' // 将所有的方法导入
import moment = require('moment') // 导入了一个函数
命名空间
使用namespace
定义命名空间,命名空间内部使用export
导出,没有使用export
导出的在外面拿不到;
在命名空间内部使用export
导出的内容实际是命名空间的属性名,可以输出之后查看编译js
后的结果;
ts
// a.ts
namespace validation {
const isLetterReg = /^[A-Za-z]+$/
export const isNumber = /^[0-9]+$/
export const checkLetter = (val: string) => {
return isLetterReg.test(val)
}
}
// b.ts
// 使用三斜杠加reference引入a.ts文件
/// <reference path='./a.ts'/>
var isLetter = validation.checkLetter('abc')
输出js文件
在命令行执行tsc --outFile src/b.js src/b.ts
,执行输出js
文件
命名空间能够实现的东西,import
都能够实现,建议使用import
而不是使用命名空间;
命名空间别名
使用import
关键字定义别名,使用别名可以很方便的解决深层次的嵌套
ts
namespace Shape {
export namespace Polygons {
export class Trggler{}
export class Person{}
}
}
import polygons = Shape.Polygons
let trggler = new polygons.Trggler()
声明合并
在ts
中,接口是可以多次声明的,声明同样的接口和命名空间,最后ts
会将多个同名声明,合并为一个
接口的合并
ts
interface Info {
name: string
}
interface Info {
age: number
}
let info: Info;
info = {
name: 'hhh',
age: 18 // 需要同时拥有这两个字段
}
在ts
中,所有的声明概况起来会创建三种实体之一,
命名空间: 实际是创建一个对象,属性是命名空间导出的内容
类型声明: 创建一个类型,并且赋值给一个名字;
值声明: 在ts
中创建了一个值
声明类型 | 创建了命名空间 | 创建了类型 | 创建了值 |
---|---|---|---|
NameSpace | √ | √ | |
Class | √ | √ | |
Enum | √ | √ | |
Interface | √ | ||
Type Alias类型别名 | √ | ||
Function | √ | ||
Variable | √ |
注意: 定义的非函数成员,属性必须是不同的,如果是相同的,那么类型必须是相同的,对于函数成员,都会被当作是函数的重载,后面的接口拥有更高的优先级
命名空间的合并
命名空间中定义的属性名没有export
导出,在同名的命名空间也无法取到
ts
namespace Validate {
const isLenth = /^[0-9]+$/
export const checkLength = () => {}
}
namespace Validate {
// 这里是取不到isLength的
export const checkLetter = () => {}
}
// 相当于
namespace Validate {
export const checkLength = () => {}
export const checkLetter = () => {}
}
类和命名空间的合并
类一定要在命名空间前面才行
ts
class Validations {
constructor(){}
public checkType(){}
}
namespace Validations {
export const numberReg = /^[0-9]+$/
}
console.log(Validations)
上面例子,将Validations
实例化之后就可以调用类上面的方法了;
函数和命名空间的合并
函数和命名空间合并也必须在命名空间前面
ts
function countUp(){
countUp.count++
}
namespace countUp {
export let count = 0;
}
枚举和命名空间的合并
枚举和命名空间不区分先后顺序,可以随意
ts
enum Colors {
red,
green,
blue
}
namespace Colors {
export const yellow = 3
}
console.log(Colors)