commonjs模块化

一、为什么会有模块化

• 在JavaScript发展初期就是为了实现简单的页面交互逻辑，寥寥数语即，如今随着前端代码日益膨胀

  这时候JavaScript作为嵌入式的脚本语言的定位动摇了，JavaScript却没有为组织代码提供任何明显帮助，JavaScript极其简单的代码组织规范不足以驾驭如此庞大规模的代码；

二.首先 看看 esm的导入导出规范：

//导出
export default  function add(a,b){ 
   return a+b
}
//导入
import add from './add.js'

二、Node.js中的模块化 commonjs规范

• CommonJS就是为JS的表现来制定规范，因为js没有模块的功能所以CommonJS应运而生，它希望js可以在任何地方运行，不只是浏览器中。

  1、创建自定义模块

  • 引入一个文件 形式模块

    //通过require来引入
    require("./aModule"); //注意一定要有"./"，文件后缀可加可不加。
    

    amodule.js文件

    console.log("我是amodule模块111");
    

  • 引入文件夹形式模块

    • home.js执行文件

    require("./aModuledir"); //必须加"./"
    

    ​ aModuleDir里的index.js文件,会自动查找文件夹下的index.js文件执行

    console.log("我是aModule模块文件夹");
    

    • 当然也可以配置默认启动文件，在文件夹内新建package.json来指定执行文件

    {
      "name":"aModule",
      "version":"1.0.0",
      "main":"test.js"
    }
    

• 自定义模块的按需导出

  通过module.exports 导出； ___dirname , __filename

  module.exports = {
      a:"我是a的值",
      b(){
          console.log("我是导出的b函数");
      }
  }
  

  引入导出文件

  let mymodule = require("bModule");
  console.log(mymodule.a);
  mymodule.b();
  

  或者简写版， 通过 exports来导出
  原理：const exports=module.exports={},exports是模块中的一个对象。

  exports.fn = function(){
      console.log("我是fn函数");  
  }
  

  导入文件

  let myfn = require("bModule").fn;
  myfn();
  // 或者 通过解构赋值 
  let { fn } = require("bModule");
  fn();
  

• 模块加载的优先级 ,先文件再目录；