模块化

1. 为什么要使用模块化?

最主要的是解决命名冲突、解决文件依赖这两大问题。

2.CMD、AMD、CommonJS 规范分别指什么?有哪些应用

AMD 即Asynchronous Module Definition,中文名是“异步模块定义”的意思。模块将被异步加载,模块加载不影响后面语句的运行。所有依赖某些模块的语句均放置在回调函数中。
AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出。所以主要应用也就是RequireJS 。
语法:

// AMD 默认推荐的是
define(['./a', './b'], function(a, b) {  
// 依赖必须一开始就写好    
a.doSomething()    
// 此处略去 100 行   
b.doSomething()    ...

虽然 AMD 也支持 CMD 的写法,同时还支持将 require 作为依赖项传递,但 RequireJS 的作者默认是最喜欢上面的写法,也是官方文档里默认的模块定义写法。

CMD(Common Module Definition) 通用模块定义。该规范明确了模块的基本书写格式和基本交互规则。该规范是在国内发展出来的。AMD是依赖关系前置,CMD是按需加载。
CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。所以主要应用也就是SeaJS 。

define(function(require, exports, module) {
   var a = require('./a')
   a.doSomething()   // 此处略去 100 行
   var b = require('./b') // 依赖可以就近书写
   b.doSomething()   // ... })

CommonJS是服务器端模块的规范。根据CommonJS规范,一个单独的文件就是一个模块。每一个模块都是一个单独的作用域,也就是说,在该模块内部定义的变量,无法被其他模块读取,除非定义为global对象的属性
Node.js应用了这个规范。
根据CommonJS规范,一个单独的文件就是一个模块。加载模块使用require方法,该方法读取一个文件并执行,最后返回文件内部的exports对象。

// a.js

var a = {
    "a":a,
    "b":b
}

module.export = a //模块导出

// b.js
var b = require('./a.js') //模块引入

requirejs打包
r.js

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 原文链接:http://www.cnblogs.com/lvdabao/p/js-modules-develop....
    舌尖上的大胖阅读 732评论 0 1
  • 什么是模块化开发? 前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来js...
    半世韶华忆阑珊阅读 673评论 0 0
  • 前端模块化 在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可;如今CPU、浏览器性能得到...
    景岳阅读 252评论 2 4
  • 在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可;如今CPU、浏览器性能得到了极大的提升...
    简不简单_都好阅读 223评论 0 0
  • 秋雨欲人饮 滴声似酒虫 雾开天已晴 人醉几时醒
    李基钦阅读 117评论 0 0