诞生背景
其他都是第三方库，只有es才是官方正宗的，如果es早就制定的话，也不至于现在的这么百花齐放（混乱）的局面了
核心规范
一个文件就是一个模块
export是暴露出模块的公开方法
import是导入
实例代码
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div class="wrapp"> <input type="text"></br> <input type="text"></br> <button>求和</button></br> <div class="sumWrap"></div> </div> <script src="lib/jquery-3.2.1.min.js"></script> <script src="bundle.js"></script> </body> </html>
app.js
/** *模块: *功能:入口 */ import {add} from './tools'; $('button').click(function () { var num1=$('input:eq(0)').val(); var num2=$('input:eq(1)').val(); var sum=add(num1,num2); $('.sumWrap').text(sum) })
tools.js
/** *模块:tools *功能:工具 */ //除了指定加载某个输出值，还可以使用整体加载，即用星号（*）指定一个对象，所有输出值都加载在这个对象上面。 import * as log from './log'; var add=function (x,y) { var sum= Number(x)+Number(y); log.info('tools>add执行结果为：'+sum); console.log(log) return sum; } export {add};
log.js
/** *模块:log模块 *功能:打印 */ var info=function (str) { console.log(str) }; var warn=function (err) { console.warn(str) }; var err=function (str) { console.error(str) }; export {info,err};
效果预览
作者说明
因为es只是出了规范，具体的是实现还是靠浏览器，目前为止没有一个浏览器支持es6模块开发规范的。所以我用了webpack编译打包了