模块化

在后端中：controller->service->mapper的过程被称为模块化，它指的是类与类之间分工分层，然后依次调用的情况。在前端中，js文件之间互相调用的过程为模块化。

1 es5的模块化

如下图建立目录结构并执行npm init。

编写01.js代码。

const sum=function(a,b){
    return parseInt(a) + parseInt(b)
}
const subtract=function(a,b){
    return parseInt(a) - parseInt(b)
}

// 设置哪些方法可以被调用
module.exports = {
    sum,
    subtract
}

在02.js中调用01.js的方法。

// 引入文件
const m = require('./02.js')

console.log(m.sum(5,8))
console.log(m.subtract(5,8))

2 es6的模块化

注意，es6的模块化代码无法直接在node.js环境下运行，而要先通过babel转码为es5代码才能在node.js环境下运行。

在之前的babeldemo目录下(已经做了babel的配置)新建文件夹es6，并在es6下新建01.js。

// 定义方法
export function getList() {
    console.log("getList...")
}

export function getUser() {
    console.log("getUser...")
}

在es6下新建02.js。

// 调用01.js的方法
import { getList, getUser } from "./01.js";

getList()
getUser()

在node下运行报错。这是因为我们使用了es6的语法，不能被识别了。

新建文件夹加es6_5，将es6的语法转为es5.

babel es6 -d es6_5

在es6_5下执行就可以输出我们方法中的信息了。

当然es6语法可以让01.js更简洁。

export default {
    getList(){
        console.log("getList...")
    },
    update() {
        console.log("update...")
    }
}

02.js对应这么写，通过别名调用方法。

// 调用01.js的方法
import m from "./01.js";

m.getList()
m.update()