TS-模块和命名空间

1.模块系统

(1)ES6模块

分开导入导出:

	export xxx;
	import {xxx} from "path";

一次性导入导出:

	export {xxx, yyy, zzz};
	import {xxx, yyy, zzz} from "path";

默认导入导出:

	export default xxx;
	import xxx from "path";

(2)Node模块

通过exports.xxx = xxx导出:

	exports.xxx = xxx
	const xxx = require("path");
	const {xx, xx} = require("path");

通过module.exports.xxx = xxx导出:

	const xxx = require("path");
	const {xx, xx} = require("path");

(3)TS

ES6的模块和Node的模块是不兼容的, 所以TS为了兼容两者就推出了。

	export = xxx;
	import xxx = require('path');

2.命名空间

(1)什么是命名空间

命名空间可以看做是一个微型模块,当我们先把相关的业务代码写在一起, 又不想污染全局空间的时候, 我们就可以使用命名空间,本质就是定义一个大对象, 把变量/方法/类/接口…的都放里面。

(2)命名空间和模块区别

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

	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));

引入外界命名空间:

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

3.声明合并

在ts当中接口和命名空间是可以重名的, ts会将多个同名的合并为一个。

(1)接口

	interface TestInterface {
	    name:string;
	}
	interface TestInterface {
	    age:number;
	}

合并:

interface TestInterface {
    name:string;
    age:number;
}
class Person implements TestInterface{
    name:string;
    age:number;
}

同名接口如果属性名相同, 那么属性类型必须一致。

	interface TestInterface {
	    name:string;
	}
	interface TestInterface {
	    name:number;  //报错
	}

同名接口如果出现同名函数, 那么就会成为一个函数的重载。

	interface TestInterface {
	    getValue(value:number):number;
	}
	interface TestInterface {
	    getValue(value:string):number;
	}
	let obj:TestInterface = {
	    getValue(value:any):number{
	        if(typeof value === 'string'){
	            return value.length;
	        }else{
	            return value.toFixed();
	        }
	    }
	}
	console.log(obj.getValue("abcdef"));
	console.log(obj.getValue(3.14));

(2)命名空间

	namespace Validation{
	    export let name:string = 'lnj';
	}
	namespace Validation{
	    export let age:number = 18;
	}

合并:

	console.log(Validation.name);
	console.log(Validation.age);

同名的命名空间中不能出现同名的变量,方法等

	namespace Validation{
	    export let name:string = 'lnj';  //报错
	    export let say = ()=> "abc";  //报错
	}
	namespace Validation{
	    export let name:string = 'zs';  //报错
	    export let say = ()=> "abc";  //报错
	}

同名的命名空间中其它命名空间没有通过export导出的内容是获取不到的

	namespace Validation{
	    let name:string = 'lnj';
	}
	namespace Validation{
	    export let say = ()=> {
	        console.log(`name = ${name}`);  //name=
	    };
	}
	Validation.say();

(3)类

	class Person {
	    say():void{
	        console.log('hello world');
	    }
	}
	namespace Person{
	    export const hi = ():void=>{
	        console.log('hi');
	    }
	}
	console.dir(Person);

(4)函数

命名空间和函数合并:函数必须定义在命名空间的前面。

	function getCounter() {
	    getCounter.count++;
	    console.log(getCounter.count);
	}
	namespace getCounter{
	    export let count:number = 0;
	}

(5)枚举

	enum Gender {
	    Male,
	    Female
	}
	namespace Gender{
	    export const Yao:number = 666;
	}
	console.log(Gender);
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值