该园用来记录个人的学习内容,有些杂乱,谅解~嘿嘿~

Chloe

自学前端的小菜鸟一枚呀~
记录学习的知识

es6 - Module

一、定义

  1. 模块:

    • 是能够单独命名并独立地完成一定功能的程序语句的集合(即程序代码和数据结构的集合体)
  2. 原因:

    • 变量和方法不容易维护,容易污染全局作用域

    • 加载资源的方式通过script标签从上到下

    • 依赖的环境主观逻辑偏重,代码较多就会比较复杂

    • 大型项目资源难以维护,特别是多人合作的情况下,资源的引入会让人奔溃

二、方案

  1. CommonJs(典型代表:node.js早期):

    • 它通过 require 来引入模块,通过 module.exports 定义模块的输出接口

    • 这种模块加载方案是服务器端的解决方案,它是以同步的方式来引入模块的

    • 因为在服务端文件都存储在本地磁盘,所以读取非常快,所以以同步的方式加载没有问题

    • 但如果是在浏览器端,由于模块的加载是使用网络请求,因此使用异步加载的方式更加合适

  2. AMD(典型代表:require.js):

    • 这种方案采用异步加载的方式来加载模块,模块的加载不影响后面语句的执行

    • 所有依赖这个模块的语句都定义在一个回调函数里,等到加载完成后再执行回调函数。require.js 实现了 AMD 规范

  3. CMD(典型代表:sea.js):

    • 这种方案和 AMD 方案都是为了解决异步模块加载的问题,sea.js 实现了 CMD 规范

    • 它和require.js的区别在于模块定义时对依赖的处理不同和对依赖模块的执行时机的处理不同

  4. ES6 Module:

    • ES6 提出的方案,使用 import 和 export 的形式来导入导出模块
posted @ 2022-08-01 14:45  Chloe56  阅读(37)  评论(0编辑  收藏  举报