模块化,requirejs 和 seajs 的异同

来源:互联网 发布:淘宝最新排名规则 编辑:程序博客网 时间:2024/05/23 02:03

模块化

定义:是指解决一个复杂问题时自顶向下逐层把系统划分成若干模块的过程,有多种属性,分别反映其内部特性。定义模块化是一种处理复杂系统分解为更好的可管理模块的方式。

  • 生活中: pc 电脑由各种组件构成, Geogle 模块化的手机
  • 程序模块化: 日期模块 Date 数学计算模块 Math 日志模块 登录认证模块 报表展示模块…. 所有的这些模块共同的组成了程序软件系统(模块系统)

程序模块化开发的优点

  • 开发效率高

    代码方便重用,别人开发的模块直接拿过来就可以使用,
    不需要重复开发类似的功能

  • 方便后期维护

模块规范

  • 对于一个模块系统来说,必须做到

    • 模块必须是私有作用域
    • 可以在模块中通过特定的方式向外暴露内容
    • 可以支持语法层面的模块加载
  • 服务器模块规范: - CommonJS(代表:node.js)

  • 浏览器端规范: AMD (代表:RequireJS) - CMD (代表:SeaJS)

  • 备注:还有UMD,通用解决方案,相对很高深,node学完再搞比较好

CommonJS, AMD, CMD, UMD 都是社区大牛弄出来的东西 (民间高手)

ECMA(官方)出了一套标准 => ECMAScript 2015(ES6), 在其中定义规范了模块化开发方式 ECMAScript 2015 Module

  • ECMAScript 2015 Module 为什么不用?因为大部分浏览器还没支持完善,要实现兼容很麻烦

requirejs 和 seajs 的异同

相同点: 都是一个适用于浏览器的 模块加载器

SeaJS 遵循 CMD 规范
RequireJS 遵循 AMD 规范

SeaJS 是预加载,懒执行, 所有模块加载完毕之后,才开始执行
RequireJS 预加载,预执行, 在加载的过程中已经执行了

  • Seajs

    • 预加载: Seajs 在 seajs.use('./js/main') 以后会先直接把所有的 require 的 js 都下载下来,这个加载,无视if(false){ require('./a') }

    • 懒执行: 然后再从头开始执行

  • ReuqireJS

    • requireJS 默认有一个基础路径,这个基础路径默认是入口模块所属的目录
    • requireJS 里面
      requirejs(['./foo'], function( fooModule ) {    })

    在require依赖的时候, 就已经会去执行 foo.js 中的代码了

1 0