AMD:浏览器中的模块规范

为实现与Node.js相同方式的模块写法,大牛们做了很多努力。但浏览器环境不同于服务器端,它的模块有一个HTTP请求过程(而Node.js的模块文件就在本地),这个请求过程多数使用script
tag,script 默认的异步性导致很难实现与Node.js一模一样的模块格式。Modules/Wrappings
使得实现变为现实。虽然和Node.js的模块写法不完全一致,但也有很多相似之处,使得熟悉Node.js的程序员有一些亲切感。但Node.js终究是服务器端的JavaScript,没有必要把这些条条框框放到浏览器JavaScript环境中。
这时AMD
诞生了,它的全称为异步模块定义。从名称上看便知它是适合script
tag的。也可以说AMD是专门为浏览器中JavaScript环境设计的规范。它吸取了CommonJS的一些优点,但又不照搬它的格式。开始AMD作为CommonJS的transport
format 存在,因无法与CommonJS开发者达成一致而独立出来。它有自己的wiki 和讨论组 。

AMD设计出一个简洁的写模块API:

define(id?, dependencies?, factory);

其中:

id: 模块标识,可以省略。
dependencies: 所依赖的模块,可以省略。
factory:
模块的实现,或者一个JavaScript对象。
id遵循CommonJS Module Identifiers
。dependencies元素的顺序和factory参数一一对应。

以下是使用AMD模式开发的简单三层结构(基础库/UI层/应用层):


base.js

define(function() {
return {
mix: function(source, target)
{
}
};
});

ui.js

define([‘base‘], function(base) {
return {
show:
function() {
// todo with module base
}

}
});

page.js

define([‘data‘, ‘ui‘], function(data, ui) {
// init
here
});

data.js

define({
users: [],
members: []
});

以上同时演示了define的三种用法,
1,定义无依赖的模块(base.js)
2,定义有依赖的模块(ui.js,page.js)
3,定义数据对象模块(data.js)



细心的会发现,还有一种没有出现,即具名模块

4,具名模块

define(‘index‘, [‘data‘,‘base‘], function(data, base) {
//
todo
});

具名模块多数时候是不推荐的,一般由打包工具合并多个模块到一个js文件中时使用。


前面提到dependencies元素的顺序和factory一一对应,其实不太严谨。AMD开始为摆脱CommonJS的束缚,开创性的提出了自己的模块风格。但后来又做了妥协,兼容了
CommonJS Modules/Wrappings 。即又可以这样写

5,包装模块

define(function(require, exports, module) {
var base =
require(‘base‘);
exports.show = function() {
// todo with
module base
}
});

不考虑多了一层函数外,格式和Node.js是一样的:使用require获取依赖模块,使用exports导出API。


除了define外,AMD还保留一个关键字require。require 作为规范保留的全局标识符,可以实现为 module
loader,也可以不实现。

目前,实现AMD的库有RequireJS 、curl 、Dojo 、bdLoad、JSLocalnet
、Nodules 等。
也有很多库支持AMD规范,即将自己作为一个模块存在,如MooTools 、jQuery 、qwery 、bonzo 甚至还有
firebug 。

AMD:浏览器中的模块规范,布布扣,bubuko.com

时间: 2024-08-09 10:29:18

AMD:浏览器中的模块规范的相关文章

浅析JS中的模块规范(CommonJS,AMD,CMD)////////////////////////zzzzzz

浅析JS中的模块规范(CommonJS,AMD,CMD) 如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已. 现在就看看吧,这些规范到底是啥东西,干嘛的. 一.CommonJS CommonJS就是为JS的表现来制定规范,因为js没有模块的功能所以CommonJS应运而生,它希望js可以在任何地方运行,不只是浏览器中. CommonJS能有一定的影响力,我觉得绝对离不开Node的人气,不过喔,Node,CommonJ

JS中的模块规范(CommonJS,AMD,CMD)

AMD CMD区别 概念: 玉伯对于 AMD 与 CMD 区别的解释: AMD 是 RequireJS 在推广过程中对模块定义的规范化产出. CMD 是 SeaJS 在推广过程中对模块定义的规范化产出. AMD 它是一个在浏览器端模块化开发的规范 Asynchronous Module Definition,用白话文讲就是 异步模块定义,对于 JSer 来说,异步是再也熟悉不过的词了,所有的模块将被异步加载,模块加载不影响后面语句运行.所有依赖某些模块的语句均放置在回调函数中. 区别 1. 对于

浅析JS中的模块规范(CommonJS,AMD,CMD) http://www.2cto.com/kf/201411/348276.html

如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已. 现在就看看吧,这些规范到底是啥东西,干嘛的. 一.CommonJS CommonJS就是为JS的表现来制定规范,因为js没有模块的功能所以CommonJS应运而生,它希望js可以在任何地方运行,不只是浏览器中. CommonJS能有一定的影响力,我觉得绝对离不开Node的人气,不过喔,Node,CommonJS,浏览器甚至是W3C之间有什么关系呢,我找到了个贴切的图

再谈 JS中的模块规范(CommonJS,AMD,CMD)来自玉伯的seajs分析

随着互联网的飞速发展,前端开发越来越复杂.本文将从实际项目中遇到的问题出发,讲述模块化能解决哪些问题,以及如何使用 Sea.js 进行前端的模块化开发. 恼人的命名冲突 我们从一个简单的习惯出发.我做项目时,常常会将一些通用的.底层的功能抽象出来,独立成一个个函数,比如 function each(arr) { // 实现代码 } function log(str) { // 实现代码 } 并像模像样地把这些函数统一放在 util.js 里.需要用到时,引入该文件就行.这一切工作得很好,同事也很

JavaSript模块规范 - AMD规范与CMD规范介绍

JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在.对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的系统,也可以将管理,开发,维护变得"有理可循".

JavaSript模块规范 - AMD规范与CMD规范介绍[转]

原文地址:http://blog.chinaunix.net/uid-26672038-id-4112229.html JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存

JavaSript模块规范 - AMD规范与CMD规范介绍(转)

JavaSript模块规范 - AMD规范与CMD规范介绍 JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题进行系统性的分解以之处理.模块化是一种处理复杂系统分解为代码结构更合理,可维护性更高的可管理的模块的方式.可以想象一个巨大的系统代码,被整合优化分割成逻辑性很强的模块时,对于软件是一种何等意义的存在.对于软件行业来说:解耦软件系统的复杂性,使得不管多么大的

前端模块规范AMD/UMD/CommonJs

.babelrc文件中的:module设置为false,为什么会要设置成false? 解释:使ES6模块语法转换到另一个模块类型(默认启用“commonjs”). 设置为假则不变换模块.或者传入(“amd”.“umd”,“systemjs”.“commonjs”). 什么是模块? Javascript的组件生态在最近几年的发展很给力,我们的可选性更加广泛了.这本是一件好事,但是当多个第三方Javascript在一起混合使用的时候,我们可能会遇到一个很尴尬的问题,那就是不是所有的组件都能在一起很愉

JS - CommonJS、ES2015、AMD、CMD模块规范对比与介绍(附样例)

一.CommonJS 1,CommonJS 基本介绍 (1)CommonJS 是一种思想,它是为 JS 的表现来制定规范.由于 JS 没有模块系统.标准库较少.缺乏包管理工具,因此 CommonJS 应运而生. (2)CommonJS 的目标是希望 JS 可以在任何地方运行,不只是浏览器中.只要我们的 JavaScript 是根据 CommonJS API 编写的,那么就可以在与 CommonJS 兼容的系统上运行. (3)根据 CommonJS API 编写的 JavaScript 可以做下面