模块化开发怎么做

模块化:一个模块是实现一个特点功能的一组方法,在最开始的时候,js 只实现一些简单的功能,所以并没有模块化的概念,但随着程序越来越复杂,代码的模块化开发变得越来越重要

由于函数具有独立作用域的特点,最原始的写法是使用函数来作为模块,几个函数作用一个模块,但是这种方法容易造成全局污染,且模块间没有联系

后来提出了对象的写法,通过将函数作为一个对象的方法来实现,这样解决了直接使用函数作用模块的一些缺点,但是这种办法会暴露所以的模块成员,外部代码可以修改内部属性的值

也可以使用立即执行函数的写法,通过利用闭包来实现模块私有作用域的建立,同时不会对全局作用域造成污染

简单来说:模块化就是 把函数作为模块 ,
缺陷: 污染全局变量, 模块成员之间没什么关系
方法: 面向对象思想 ,并使用立即执行函数 ,实现闭包 避免了变量污染 同时同一模块内的成员也有了关系 在模块外部无法修改我们没有暴露出来的变量、函数 这就是简单的模块

js 的几种模块规范

  1. CommonJS 方法,它通过 require 来引入模块,通过 module.exports 定义模块的输出接口,这种模块加载方案是 服务端的解决方法,它是以同步的方式来引入模块的,因为在服务DAU文件都存储在本地磁盘,读取非常快,所以以同步的方式加载没有问题但如果是在浏览器端,由于模块加载时使用网络请求,因此使用异步加载的方式更加合适

  2. AMD 方法,这种方法采用异步加载的方式来加载模块,模块的加载不影响后面语句的执行,所有依赖这个模块的语句都定义在一个回调函数里,等到加载完成后再执行回调函数 require.js 实现了 AMD 规范

  3. CMD 方案,这种方案和 AMD 方案都是为了解决异步模块加载的问题,sea.js实现了 CMD 规范,它和require.js 的区别在于模块定义时对依赖的处理不同对依赖模块的执行时机的处理也不同

  4. ES6 提出的方案,使用 import 和 export 的形式来导入导出模块,这种方案和上面三种方案都不同

AMD 和 CMD 规范的区别

主要区别在两个方面

  1. 第一个方面是在模块定义时对依赖的处理不同,AMD 推崇依赖前置,在定义模块的时候就要声明其依赖的模块,而 CMD 推崇就近依赖,只有利用某个模块的时候再去 require

  2. 第二个方面试依赖模块的执行时机处理不同,首先 AMD 和 CMD 对于模块的加载方式都是异步加载,不过他们在于模块的执行时机,AMD 在依赖模块加载完成后就直接执行依赖模块,依赖模块的执行顺序和我们书写的顺序不一定一致,而 CMD 在依赖模块加载完成后并不执行,只是下载而已,等到所有的依赖模块都加载好后,进入回调函数逻辑,遇到require语句时才执行对应模块