关于js模块化管理ES6和commonJS语法的使用

1. 平常习惯记录一下
2. ES6引入模块化管理写法（ES6 模块的运行机制与 CommonJS 不一样。JS 引擎对脚本静态分析的时候，遇到模块加载命令import，就会生成一个只读引用。等到脚本真正执行时，再根据这个只读引用，到被加载的那个模块里面去取值。ES6 模块不会缓存运行结果，而是动态地去被加载的模块取值，并且变量总是绑定其所在的模块。（也就是说声明一个变量，同样的函数改变了值，同样的值会改变））

// 这个属于es6的写法  js的模块化开发
//    这是我导出的方法一
function methodOne() {
    //    这是我导出的方法一
}
function methodTwo() {
    //    这是我导出的方法二
}
export {
    methodOne,
    methodTwo,
}
export default function() { console.log('我是默认导出，您可以随便取名')}
// 以上我是导出的js文件
// 以下我是导入的js文件
import myName from 'js的路径名'  // 针对于默认的用法
myName(); // 直接调用就行
// export default在同一个模块中，不允许同时存在多个。

// import *as myAllJs from '../main'  这个属于全部导入的方式导入 as后面是导入全部方法以及变量的时候的别名
// myAllJs.methods 相当于直接调用其中的函数即可

3.commonJS语法的使用（正好commonJS相反，声明一个变量赋值过后不会改变函数（引入的函数内）CommonJS 模块输出的是值的拷贝，也就是说，一旦输出一个值，模块内部的变化就影响不到这个值。）

// commonJs的使用方法
 // 导出的JS文件
module.exports={
    myMethodOne:function () {
    //    这是我导出的方法一
    },
    myMethodTwo:function () {
        //    这是我导出的方法二
    }
}
// const myMethod = require('导入文件js即可')
// let myMethodOne = myMethod.myMethodOne
// const {myMethodOne,myMethodTwo}= require('导入文件js即可')
// myMethodOne等价与methodOne.myMethodOne直接就可以直接使用了

4.另外CommonJS 加载的是一个对象（即module.exports属性），该对象只有在脚本运行完才会生成。而 ES6 模块不是对象，它的对外接口只是一种静态定义，在代码静态解析阶段就会生成。

具体例子借鉴