js模块化 ES6规范 使用总结

1.模块化语法

　　export　　用于规定模块的对外接口

　　　　1 分别暴露 m1.js　　　

　　　　　　export let name = 'zhangning';
　　　　　　export function like(){
　　　　　　　　console.log('打篮球');
　　　　　　}

　　　　2 统一暴露 m2.js　

　　　　　　let name = 'zhangning1';
　　　　　　function job(){
　　　　　　　　console.log('努力工作');
　　　　　　}
　　　　　　export {name, job};

　　　　3 默认暴露 m3.js

　　　　　　export default {
　　　　　　　　name: 'zhangning2',
　　　　　　　　change: function(){
　　　　　　　　　　console.log('改变自己努力学习');
　　　　　　　　}
　　　　　　}

　　import　　用于输入其他模块提供的功能

　　　　1 通用引入　

　　　　　　import * as m1 from'/m1.js';
　　　　　　import * as m2 from '/m2.js';
　　　　　　import * as m3 from '/m3.js';

　　　　2 解构赋值形式

　　　　　　import {name, like} from '/m1.js';
　　　　　　import {name as name1, job) from '/m2.js';// 同一个js中引入不能重名，所以name要用别名
　　　　　　import {default as m3) from '/m3.js';

　　　　3 简便形式　　只针对默认暴露

　　　　　　imprt m3 from '/m3.js';

 　　　　浏览器引入方式，可以使用上面三种，

　　　　　　还可以使用 script 标签中直接引用,设置 type 为 module，在m.js中通过import引入模块

　　　　　　<script src='./m.js' type='module'></script>