Javascript模块化编程(二):AMD规范

web前端面试-- 模块化的几种规范CMD、COMMONJS、AMD、ESM以及UMD模块化解决方案,export *的写法 JavaScript 目前有四种模块规范:CMD、COMMONJS、AMD 和 ESM。CMD 是 JavaScript 最早的模块规范,它使用 require 函数来导入模块。CMD 模块是 JavaScript 最早的模块规范,但它存在一些缺陷,比如模块的导入顺序不受控制,模块的依赖关系无法被管理,等等。COMMONJS 是 JavaScript 模块的另一种,它使用 require 函数来导入模块。COMMONJS 模块在解决CMD。 阅读详情

作者: 阮一峰

日期: 2012年10月30日

这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块。

(接上文)

七、模块的规范

先想一想,为什么模块很重要?

因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。

但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!考虑到Javascript模块现在还没有官方规范,这一点就更重要了。

目前,通行的Javascript模块规范共有两种:CommonJS和AMD。我主要介绍AMD,但是要先从CommonJS讲起。

八、CommonJS

2009年,美国程序员Ryan Dahl创造了node.js项目,将javascript语言用于服务器端编程。

这标志"Javascript模块化编程"正式诞生。因为老实说,在浏览器环境下,没有模块也不是特别大的问题,毕竟网页程序的复杂性有限;但是在服务器端,一定要有模块,与操作系统和其他应用程序互动,否则根本没法编程。

node.js的模块系统,就是参照CommonJS规范实现的。在CommonJS中,有一个全局性方法require(),用于加载模块。假定有一个数学模块math.js,就可以像下面这样加载。

  var math = require('math');

然后,就可以调用模块提供的方法:

  var math = require('math');

  math.add(2,3); // 5

因为这个系列主要针对浏览器编程,不涉及node.js,所以对CommonJS就不多做介绍了。我们在这里只要知道,require()用于加载模块就行了。

九、浏览器环境

有了服务器端模块以后,很自然地,大家就想要客户端模块。而且最好两者能够兼容,一个模块不用修改,在服务器和浏览器都可以运行。

但是,由于一个重大的局限,使得CommonJS规范不适用于浏览器环境。还是上一节的代码,如果在浏览器中运行,会有一个很大的问题,你能看出来吗?

  var math = require('math');

  math.add(2, 3);

第二行math.add(2, 3),在第一行require('math')之后运行,因此必须等math.js加载完成。也就是说,如果加载时间很长,整个应用就会停在那里等。

这对服务器端不是一个问题,因为所有的模块都存放在本地硬盘,可以同步加载完成,等待时间就是硬盘的读取时间。但是,对于浏览器,这却是一个大问题,因为模块都放在服务器端,等待时间取决于网速的快慢,可能要等很长时间,浏览器处于"假死"状态。

因此,浏览器端的模块,不能采用"同步加载"(synchronous),只能采用"异步加载"(asynchronous)。这就是AMD规范诞生的背景。

十、AMD

AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

AMD也采用require()语句加载模块,但是不同于CommonJS,它要求两个参数:

  require([module], callback);

第一个参数[module],是一个数组,里面的成员就是要加载的模块;第二个参数callback,则是加载成功之后的回调函数。如果将前面的代码改写成AMD形式,就是下面这样:

  require(['math'], function (math) {

    math.add(2, 3);

  });

math.add()与math模块加载不是同步的,浏览器不会发生假死。所以很显然,AMD比较适合浏览器环境。

目前,主要有两个Javascript库实现了AMD规范:require.js和curl.js。本系列的第三部分,将通过介绍require.js,进一步讲解AMD的用法,以及如何将模块化编程投入实战。

(完)

Javascript模块化编程(一)AMD规范(规范使用模块) 个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块,先想一想,为什么模块很重要?接下来为您详细介绍,感兴趣的朋友可以了解下啊 立即下载

相关推荐

升降机SEW MOVIDRIVE变频器设置

选择PO1 第2,3,9,13 位,点击“SendPA”Start reference,编码器反馈值为0(PI2/3 Actual position=0)提示:传送参考位置前请断开变频器安全24V电源,否则会弹出禁止修改提示框;提示:做这一步时,如果出现电机不能转动,或产生报警不能通过编码器匹配。下载配置的参数,提示:下载参数需要断开变频器的安全24V电源。编码器匹配通过后点击下一步,进入下图画面传送参考位置。1电机不能转动:a可能是由于变频器的安全24V未给。点击2.SEW总线扩展定位,定位块设置。

xdpcxq的专栏 5394

Javascript模块化编程(一):模块的写法

随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂。 网页越来越像桌面程序,需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑。 Javascript模块化编程,已经成为一个迫切的需求。理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块。 但是,Javascript...

weixin_30851867的博客 509

SAP HR模块配置假期日历和缺勤类型

SAP的HR模块。业务顾问在实施时一般会配置未来10年的假期日历,到期后再进行配置。同时,增加请假类型(缺勤信息类型)。记录这一过程。

福来阁86号技师的妖孽日常 5521

js的简单模块化(AMD)标准

通过requireJS语句将各个模块的地址载入调用 <script src = 'Ja-vascript\require.js' async='true' defer data-main="Ja-vascript/xxxx"></script> 这个上面的地址是存放requ...

a86669的博客 301

非线性动力学_用MatCont分析非线性动力学方程组(一)

写在前面:笔者打算写两到三篇系列文章介绍MatCont,此为第一篇《用MatCont分析非线性动力学方程组(一)》。MatCont是一个基于Matlab而开发的免费工具包,专门用来做非线性动力学模型分叉、向量场、周期性等分析,符号(连续性)运算和数值(离散性)运算均适用。该工具的开发及研究项目由比利时Ghent大学的Willy Govaerts教授、荷兰Utrecht大学的Yuri Kuznets...

weixin_39700215的博客 2765

DeepSeek Harness实战:从零构建插件化AI Agent

AI Agent开发正从硬编码走向框架化组织,插件化架构成为提升工程效率的关键。在构建可复用、可扩展的智能体系统时,开发团队需要一套能够统一管理模型调用、工具注册与上下文组装的基础设施。DeepSeek Harness作为面向Agent工程的插件化框架,通过Harness、DeepAgent与Skill三个核心抽象,将模型、工具与技能解耦为可插拔单元,让开发者无需重复造轮子即可快速搭建具备工具调用能力的智能体。本文从环境配置到Skill插件开发,完整演示如何基于DeepSeek模型构建一个可运行的Agent

weixin_34279184的博客 440

AMD 规范使用总结

转自:http://www.jianshu.com/p/9b44a1fa8a96 AMD模式 define和require这两个定义模块、调用模块的方法,合称为AMD模式。它的模块定义的方法非常清晰,不会污染全局环境,能够清楚地显示依赖关系。AMD模式可以用于浏览器环境,并且允许非同步加载模块,也可以根据需要动态加载模块。 define方法:定义模块 d...

ankan7400的博客 488

在 SAP BTP 上为应用开启多租户能力:基于 SaaS Provisioning 和 XSUAA 的完整实践指南

本文介绍了在SAP BTP上配置多租户应用的实战指南。主要内容包括: 多租户架构概述:解释provider子账户、consumer子账户和tenant的概念,以及数据隔离机制。 安全配置:在xs-security.json中设置tenant-mode为shared,并为SaaS Provisioning服务添加回调scope授权。 路由配置:通过manifest.yml设置TENANT_HOST_PATTERN来定义多租户访问模式,确保不同租户通过不同子域名访问同一应用。 服务绑定:将XSUAA和SaaS

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 144

javascript模块化编程(二)—AMD规范

一、js的模块化规范: 服务器端:commonjs 浏览器端:AMD("Asynchronous Module Definition"的缩写,意思就是"异步模块定义") 二、为什么采用AMD 如下代码 var math = require('math');   math.add(2, 3);必须等待math.js加载完成,否则会出现加载时间很长现象 三、define define(i

wlkkn的专栏 2187

Vue2 - 详细实现网页 “开启录音并生成音频文件,上传到服务器效果“,浏览器录制外部音频调用麦克风并传到后端,兼容全部浏览器、支持 PC 网页或手机 H5 网页、可本地播放试听(详细示例运行代码)

vue,nuxt,uniapp,网页网站,麦克风,网页录音,MediaRecorder,浏览器录音,移动端h5网页,手机端录音,web网页录音,recorder-core官方文档,Recorder,非https怎么本地录音,录音报错失败,录音后怎么播放音频,如何获取录音mp3文件,解决一直不提示麦克风权限,小白详细教程,实时录音,调用浏览器麦克风录音,浏览器不兼容,wav,mp3,vue怎么实现网页录音呢,vue2网页录音并上传到服务器,web如何实现录制音频,vue网页录音,音频录制播放和上传服务器,vu

🏆 前端领域优质创作者 6003

智驾芯片&软件分层&测试

智能驾驶相关的芯片,软件分层,测试相关内容

天赐好车的博客 436

Javascript模块化编程学习(二):AMD规范和require.js的用法

一、AMD AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。 AMD也采用require()语句加载模块,但是不同于CommonJS,它要求两个参数:   require([modu

zhengyaolei的专栏 1026

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

javascript模块化编程(二):AMD规范

本文来自阮一峰 这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块。 (接上文) 七、模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。 但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!考虑到Javascrip...

djvx81654的博客 143

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

Javascript模块化编程(二):AMD规范【转】

http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html 作者: 阮一峰 日期: 2012年10月30日 这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块。 (接上文) 七、模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可...

weixin_30478757的博客 127

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

上一篇: Javascript模块化编程(一):模块的写法
下一篇: Javascript模块化编程(三):require.js的用法
wangshfa
博客等级 码龄17年 117粉丝 2原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值