ES6学习笔记之ES6中的模块

一ES6中的模块（CMD规范）

1 import和export基本使用
重点：在ES6中新增了js文件的暴露和引入的新写法：（import和export）

     node                     es6
     require()             →  import
     exports.***           → export
     module.exports        →  default

使用export const 暴露函数名暴露函数，import {} from “./路径”; 接收函数。

注意两个问题：

1. l 暴露时是什么名字，接收时一定是什么名字，比如暴露的是mianji，接收就叫mianji。
2. 路径必须“./”开头

2命名空间
两个js文件同时向外外暴露两个相同名字的函数会报错，因为函数名重复了：
解决方法就是命名空间：用import * as fang from “./路径”; 来接收函数

import * as yuan from "./yuan.js";
import * as fang from "./fang.js";
 
console.log(yuan.mianji(10))
console.log(fang.mianji(10))

此时函数必须通过yuan打点，或fang打点调用，因为接收到的是一个JSON。
也就是说import * as fang from “./文件”;的语法，可以有效避免函数的名字冲突。
注意：import * as的这个名字，必须和文件名相同。

3.默认暴露
如果js文件中是一个类（构造函数），此时不希望有命名空间，用默认暴露：

export default
相当于nodejs中的module.exports

比如写一个文件叫People.js这个文件向外暴露一个类：

export default class People {
    constructor(name,age,sex){
        this.name = name;
        this.age = age;
        this.sex = sex;
    }
    change(){
        alert(`啦啦啦！我是卖报的${this.name}，今年${this.age}`)
    }
}

在主入口文件，就不用{}引用这个类：

import People from "./People.js"; //类叫什么名字，import后就叫什么名字

一个文件可以有多个普通暴露，但是只能有一个默认暴露
注意：引入时，接收默认的暴露，不能加{}，接收普通暴露的加{}

import People, {a,b,f1,f2} from "./People.js";

暴露模块：

引用模块：