调用的时候 统一使用 import {xxx,xxx2,xxx3} from 'xxx' 的形式调用。
当然了如果只用到其中一个变量或函数，那么只需要import进来需要的那个就行了，比如 import {a1} from './A' .

但有时候遇到这种情况，名字重复比如B.js里面已经有个变量叫a1了，那么就加个 as 起个别名。

//B.js import {a1 as a111,fn} from './A' console.log(a111)

还有一种常用的import是这样的：

import * as A from './A' console.log(A.a1)

这个怎么理解记忆呢，就是A模块在代码里不是这样导出的吗—— export {a1,fn} 这里看成导出了一个对象，对应我们 import * as A from './A 里面的 * ，然后我们给它起了个别名叫 A ,当然叫 A 是为了记忆使用的方便，你可以叫其他什么 abcd ,那么调用的时候就是 abcd.a1 abcd.fn .

以上就是一种 export 和两种import 的搭配使用方式。在我自己早期import和export也是各种组合用，自己把自己搞糊涂了，最后发现就这俩套路翻来覆去的用，就能解决问题。

各自导出的方式

当然了，除了自己写代码，还经常调用别人写的代码，比如有这个C模块：

export var c1 = 222 export function fn() {

我一般不推荐这种写法，缺点之一是导出的变量或者函数分散在代码的各个地方，没有一个统一管理的地方，另一个缺点是不能够直观的让人理解导出的形式。

不过如果是别人写的话我们也没有办法，那我们自己可以在脑子里把他成想象成之前说的的那种导出方式：

var c1 = 222 function fn() { export{c1,fn}

那么怎么import使用就和上面的基本情况一样了，就不赘述了。

default的用法

还有一种export用法

//C.js var c1 = 222 function fn() { var c2=222 export { c1,fn} export default c2

注意这里的c2前面加了个default，那这个有啥用的呢，就是其他模块import的时候能简单点——少写一对大括号。

import c2 from "./C";

当然这里有个所谓的『优点』就是直接起别名 import c222 from "./C" 相当于 import c2 as c222 from "./C"

然后如果我们的代码里还使用了C模块的其他变量或函数，那就要这样了

import c2 ,{c1,fn} from "./C";

你就会发现import的用法瞬间成笛卡尔积复杂起来：加大括号的、不加大括号的、起别名加as的、不加as的、import*的、不带星的再乘以export的分开export的、不分开export的 default和不default的…………

export：规定模块对外接口

①默认导出：export default Test(导入时可指定模块任意名称，无需知晓内部真实名称)

②单独导出：export const name = "Bruce"

③按需导出：export { age, name, sex }(推荐)

④改名导出：export { name as newName }

import：导入模块内部功能

①默认导入：import Test from "test"

②整体导入：import * as Test from "test"

③按需导入：import { age, name, sex } from "test"

④改名导入：import { name as newName } from "test"

⑥自执导入：import "test"

⑦复合导入：import Test, { name } from "test"

export命令和import命令结合在一起写成一行，变量实质没有被导入当前模块，相当于对外转发接口，导致当前模块无法直接使用其导入变量

①默认导入导出：export { default } from "test"

②整体导入导出：export * from "test"

③按需导入导出：export { age, name, sex } from "test"

④改名导入导出：export { name as newName } from "test"

⑤具名改默认导入导出：export { name as default } from "test"

⑥默认改具名导入导出：export { default as name } from "test"

继承：默认导出和改名导出结合使用可使模块具备继承性;

设计思想：尽量地静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量;

严格模式：ES6模块自动采用严格模式.

基本用法比如模块A 向外部提供变量a1和函数fn供其他模块调用，那么我们在模块B中调用a1和fn。//A.jsvar a1=111function fn(){}export {a1,fn} //在文件的底部统一导出，即使有时候导出的变量只有一个也这样写那么在B.js中调用的形式就是这样：//B.jsimport {a1,fn} from './A'console.log(a1)fn()调用的时候 统一使用import {xxx,xxx2,xxx. 新创建index. ts 文件时自动导出打字稿文件。 在index. ts 文件中时，运行此扩展名（“导出打字稿：写导出”） export * from ./<FILE>当前目录中的每个同级文件/文件夹添加 export * from ./<FILE> 。 通过在配置中设置 export Star=false ，可以显式导出声明，例如 export { Foo, Bar } from ./<FILE> 。 默认配置将导出所有具有index. ts 文件的同级. ts 文件和文件夹。 " export -typescript.excludes " :[ " *.{spec. ts ,spec. ts x} " ], " export -typescript.includes " :[ " *.{ ts , ts x} " , " */index.{ export {} //加上 export 或者 import ,表示这个文件是一个模块,里面声明的变量就会变成局部变量; 不加表示全局变量,如果其他文件也有一样的命名,就会报错 class Person { name: string = "111"; //设置默认值 getName():void { console.log(this.name); let p1 = new Person() p1.name = '111' p1.getName() // 定义