JS模块化-实现一个简单的CommonJS

一、需求：首先CommonJS中我们主要实现的内容是：

1.模块加载器： 解析文件地址，通过node，这次我们直接给一段代码传入，先不写解析部分

2.模块解析器： 执行文件内容

二、代码

1.创建一个class,定义传参和变量等

class Module {
   
  // 传入模块名称和文件内容(要执行的代码块)
  constructor(moduleName, source) {
   
    this.export = {
   }; // 定义模块要返回的export
    this.moduleName = moduleName;
    this.source = source;
  }
}

2.Require

》创建模块

》执行文件内容

》返回export

 require = (moduleName,source) => {
   
    // 创建一个模块
    const module = new Module(moduleName, source);
    
    // 执行文件得到结果
    const exports = compile(module, source);

    // 通过require返回结果
    return exports;
  }

》缓存

class Module {
   
  // 传入模块名称和文件内容(要执行的代码块)
  constructor(moduleName, source) {
   
    this.export = {
   }; // 定义模块要返回的export
    this.moduleName = moduleName;
    this.source = source;
    this.$cacheModule = new Map(); // 定义一个缓存变量
  }
  require = (moduleName,source) => {
   
    // 缓存中有这个模块的数据的话就返回缓存的exports
    if($cacheModule.has(moduleName)){
   
      return $cacheModule.get(moduleName).exports;
    }
    // 创建一个模块
    const module = new Module(moduleName, source);

    // 执行文件得到结果
    const exports = compile(module, source);

    // 把module存入缓存
    this.$cacheModule.set(moduleName, module);

    // 通过require返回结果
    return exports;
  }
}

》IIFE

声明完之后便直接执行的函数，这类函数通常是一次性使用的，因此没必要给这类函数命名，直接让它执行就好了
IIFE的作用就是防止变量全局污染，以及保证内部变量的安全
他是通过模仿一个私有作用域，用匿名函数作为一个“容器”，“容器”内部可以访问外部的变量，而外部环境不能访问“容器”内部的变量，所以 ( function(