TypeScript的模块

与ES6一样，TypeScript也引入了模块化的概念，TypeScript也可以使用ES6中的export、export default和import导出和引入模块类的数据，从而实现模块化

前后端的区别

• require：node和es6都支持的引入
• export和import：ES6支持的导出引入，在浏览器和node中不支持，需要babel转换，而且在node中会被转换为exports，但是在TypeScipt中使用编译出来的JS代码可以在node中运行，因为会被编译为node认识的exports
• module.exports和exports：只有node支持的导出

1. 导出

1.1 导出声明

任何声明(比如变量、函数、类、类型别名或接口)都能够通过添加export关键字来导出

export interface StringValidator {
  isAcceptable(s: string): boolean;
}

export const numberRegexp = /^[0-9]+$/;

export class ZipCodeValidator implements StringValidator {
  isAcceptable(s: string) {
    return s.length === 5 && numberRegexp.test(s);
  }
}

1.2 导出语句

// 上面的语句可以直接通过导出语句来写
const numberRegexp = /^[0-9]+$/;
interface StringValidator {
  isAcceptable(s: string): boolean;
}
class ZipCodeValidator implements StringValidator {
  isAcceptable(s: string) {
    return s.length === 5 && numberRegexp.test(s);
  }
}
export { ZipCodeValidator };
export { ZipCodeValidator as mainValidator }; // as能够改变导出变量的名字,在外部接收时使用

1.3 默认导出

每个模块都可以有一个default导出，默认导出使用 default关键字标记，并且一个模块只能够有一个default导出。需要使用一种特殊的导入形式来导入 default导出。通过export default导出的值可以用任意变量进行接收

注：类和函数声明可以直接被标记为默认导出，标记为默认导出的类和函数的名字是可以省略的

// ZipCodeValidator.ts
export default class ZipCodeValidator {
  static numberRegexp = /^[0-9]+$/;
  isAcceptable(s: string) {
    return s.length === 5 && ZipCodeValidator.numberRegexp.test(s);
  }
}

import validator from "./ZipCodeValidator";
let myValidator = new validator();

export default导出也可以是一个值

// OneTwoThree.ts
export default "123";

import num from "./OneTwoThree";
console.log(num); // "123"

1.4 导出模块

TypeScript提供了export =语法，export =语法定义一个模块的导出对象

这里的对象一词指的是类、接口、命名空间、函数或枚举

若使用export =导出一个模块，则必须使用TypeScript的特定语法import module = require("module")来导入此模块

// ZipCodeValidator.ts
let numberRegexp = /^[0-9]+$/;
class ZipCodeValidator {
  isAcceptable(s: string) {
    return s.length === 5 && numberRegexp.test(s);
  }
}
export = ZipCodeValidator;

import zip = require("./ZipCodeValidator");

// Some samples to try
let strings = ["Hello", "98052", "101"];

// Validators to use
let validator = new zip();

// Show whether each string passed each validator
strings.forEach(s => {
  console.log(`"${ s }" - ${ validator.isAcceptable(s) ? "matches" : "does not match" }`);
});

---

2. 导入

模块的导入操作与导出一样简单，可以使用以下 import形式之一来导入其它模块中的导出内容

import { ZipCodeValidator } from "./ZipCodeValidator";
let myValidator = new ZipCodeValidator();

// 可以对导入内容重命名
import { ZipCodeValidator as ZCV } from "./ZipCodeValidator";
let myValidator = new ZCV();

// 将整个模块导入到一个变量，并通过它来访问模块的导出部分
import * as validator from "./ZipCodeValidator";
let myValidator = new validator.ZipCodeValidator();

当然,也可以直接使用import导入一个不需要进行赋值的模板,该模板会自动进行内部的代码

import "./my-module.js";