Js模块化规范理解

详见 阮一峰 博客链接点击打开链接

commonjs-主要用于服务端的规范，是一个同步的过程

module.exports = {obj: obj} ---模块暴露

var obj = require(./上边文件名)

commonjs规范不适合浏览器的模块化开发--阻塞假死状况--出现ADM规范

AMD 规范用到 Require.js库--依赖前置-先执行依赖的模块-后执行当前模块

定义模块： define([依赖的模块], function(){ 自定义模块 })

引入模块：require([依赖的模块], function(){ 回调 })

CDM规范-sea.js和require.js的区别主要是“定义的方式上和模块的执行时机上-就近依赖原则-需要的时候再去require”

SeaJS主要是对模块先加载不执行，等到遇到require的时候才会去执行模块。

定义模块： define(function( require, exports, module ){ })

ES6模块化规范

es6 中新增了两个命令 export 和 import

export 命令用于规定模块的对外接口，import 命令用于输入其他模块提供的功能。

代码示例：（基本用法）

export const add = function (a, b) {
    return a + b
}
export const subtract = function (a, b) {
    return a - b
}
引用文件
import { add, subtract } from './test.js'

add(1, 2)
substract(3, 2)

es6使用详细链接 点击链接查看

exports的详细用法

export 不止可以导出函数，还可以导出对象，类，字符串等等

export const obj = {
    test1: ''
}
export const test = ''

exrpot class Test {
    constuctor() {
    }
}
或者是下边的写法

var name = "name"

var age = "age"

export {name, age}

import { test, b, c} from './test.js' // 改变命名后只能写 as 后的命名

默认导出-export default 指定默认输出 import 无需变量名就可以直接使用

// test.js

export default function () {
    console.log('hello world')
}
1
2
3
import say from './test.js' // 这里可以指定任意变量名

say() // hello world