模块的概念
模块的概念(官方):
关于术语的一点说明:务必注意一点,TypeScript 1.5里术语名已经发生了变化。“内部模块”现在称作“命名空间”。 “外部模块”现在则简称为“模块”,模块在起自身的作用域里执行,而不是在全局作用域里;这意味着定义在一个模块里的类、变量、函数、接口等在模块外部是不可见的,除非你明确地使用export形式之一导出他们。相反,如果想使用其他模块导出的类、变量、函数、接口等的时候,必须要使用import形式之一导入他们。
模块的概念(自己理解)
我们可以吧一些公共的功能单独抽离成一个文件作为一个模块。模块里面的变量、函数、类等默认是私有的,如果我们要在外部访问模块里的数据(变量、函数、类),我们需要通过export暴露模块里面的数据(变量、函数、类… )。暴露后我们通过import引入模块就可以使用模块里面暴露的数据(变量、函数、类… )。
在项目目录新建modules目录,新建db.ts文件,编写代码
let dbUrl: string = 'xxxxxxxxxxxxxxxxxxxx';
function getData(): any[] {
console.log('获取数据库的数据1111');
return [
{
title: 'aaaa',
desc: 'aaaaaa'
},
{
title: 'bbbb',
desc: 'bbbbbb'
}
]
}
function save() {
console.log('保存数据成功!!');
}
// 将变量、方法都导出了
export {
dbUrl, getData, save }
如下使用import语法导入db模块
import 中可以使用as取别名
import {
dbUrl,getData as get,save} from './modules/db';
console.log(dbUrl);
get();// 调用了db模块中的getData方法;
save(); // 调用save方法
/* 输出:
xxxxxxxxxxxxxxxxxxxx
获取数据库的数据1111
保存数据成功!! */
export default 默认导出
每个模块都可以有一个default导出。默认导出使用default关键字标记;并且一个模块只能够有一个default导出。需要使用一种特殊的形式来导入
同样在modules目录创建db1.ts,
let dbUrl: string = 'xxxxxxxxxxxxxxxxxxxx';
function getData(): any[] {
console.log('DB1,获取数据库的数据0000000000');
return [
{
title: 'aaaa',
desc: 'aaaaaa'
},
{
title: 'bbbb',
desc: 'bbbbbb'
}
]
}
function save() {
console.log('保存数据成功!!');
}
// 默认导出getData
export default getData;
// 使用
import getData from './modules/db1'
getData();
模块封装与使用案例
将上一节的操作数据库的代码封装在一个模块中
在modules目录新建DBHelp.ts
interface IDB<