`
JavaSam
  • 浏览: 951801 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

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

 
阅读更多

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

  (接上文

  七、模块的规范

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

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

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

  目前,通行的 Javascript 模块规范共有两种:CommonJSAMD。我主要介绍 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.jscurl.js。本系列的第三部分,将通过介绍 require.js,进一步讲解 AMD 的用法,以及如何将模块化编程投入实战。

分享到:
评论

相关推荐

    Javascript模块化编程(二)AMD规范共3页.pd

    JavaScript模块化编程是现代Web开发中的重要组成部分,它允许开发者将复杂的代码结构组织成可重用、可维护的模块。AMD(Asynchronous Module Definition)规范是JavaScript模块化的一种实现方式,尤其在大型前端项目...

    Javascript模块化编程

    ### JavaScript模块化编程知识点 #### 一、模块化的重要性 模块化编程是现代软件开发的基础之一,尤其是在JavaScript这种广泛应用于Web开发的语言中尤为重要。模块化的关键在于它允许开发者将复杂的程序拆分成更小...

    JavaScript模块化编程

    ### JavaScript模块化编程 #### 一、理解JavaScript模块化 ##### 1.1 模块化的概念 在软件工程中,模块化是一种重要的设计思想,指的是将复杂的系统分解成一系列独立的功能单元(即模块),每个模块负责实现系统...

    Javascript模块化编程(三):模块化编程实战,试用SeaJS

    JavaScript模块化编程是现代Web开发中的重要组成部分,它有助于组织代码、提高可维护性和复用性。本篇文章将深入探讨JavaScript模块化编程的实战应用,特别是通过试用SeaJS这一工具来实现。SeaJS是一款专注于浏览器...

    Javascript模块化编程(Require.js)

    JavaScript模块化编程是一种组织代码的方式,它使得代码更易于维护、重用和协作。Require.js是JavaScript的一个模块加载器,它引入了AMD(Asynchronous Module Definition)规范,为JavaScript提供了异步加载模块的...

    Javascript模块化编程详解

    JavaScript模块化编程是一种组织代码的方式,它使得代码更容易理解和维护。模块化编程通过将相关的功能封装起来,避免了全局变量的滥用,提高了代码的复用性。本文将深入讲解JavaScript模块化编程的基础和一些进阶...

    Javascript模块化编程(一)AMD规范(规范使用模块)

    总的来说,AMD规范通过异步加载机制,为在浏览器环境下实现JavaScript模块化提供了有效的解决方案。它不仅提高了代码的组织性,还优化了网络性能,是当前流行的前端开发实践之一。然而,随着技术的发展,目前ES6模块...

    模块编程AMD规范

    通过以上内容,我们可以看出RequireJS和AMD规范在JavaScript模块化编程中的重要作用,它们提供了高效、灵活的代码组织方式,促进了代码的模块化和可维护性。对于开发大型的、依赖复杂的前端应用来说,掌握AMD规范和...

    JavaScript模块化编程七日

    JavaScript模块化编程是现代Web开发中的关键组成部分,它允许开发者将复杂的代码结构组织成可重用、可维护的模块。在“JavaScript模块化编程七日”这个主题中,我们将深入探讨这一重要概念,涵盖从基本的模块化原理...

    Modules02. JavaScript 模块化编程.pdf_前端学习资料

    JavaScript 模块化编程是解决日益复杂的前端项目管理和维护的关键技术。随着JavaScript在Web开发中的核心地位不断巩固,模块化成为了应对代码量增大、逻辑复杂度提高的有效手段。本文将深入探讨JavaScript模块化的...

    论JavaScript模块化编程_.docx

    JavaScript模块化编程是解决代码组织和管理问题的关键技术,尤其对于大型项目而言,它能够确保代码的可维护性、可重用性和可扩展性。在JavaScript的传统开发模式中,全局变量的滥用、脚本依赖顺序的混乱以及大量脚本...

    Javascript模块化编程(三)require.js的

    总结来说,require.js是JavaScript模块化编程的重要工具,通过AMD模式实现模块定义、依赖管理和异步加载,提高了代码的组织性和运行效率。在大型项目中,结合r.js进行代码优化,可以有效地管理复杂的应用结构。了解...

    JavaScript:模块化编程与CommonJS教程

    CommonJS 是最早被广泛采用的一种JavaScript模块化编程规范,特别是在Node.js环境中。它定义了一套用于服务器端的模块加载规则。 - **require()函数**:用于加载其他模块。当一个模块通过`require()`函数加载时,该...

    javascript模块化

    ### JavaScript模块化详解 #### 一、模块化的背景与意义 在现代Web开发中,JavaScript作为客户端编程的主要语言,其重要性不言而喻。随着Web应用变得越来越复杂,单个脚本文件往往无法满足需求,这就导致了多个...

    JavaScript前端开发模块化教程_PPT.rar

    JavaScript前端开发模块化教程 在当今的Web开发领域,JavaScript作为客户端编程的首选语言,其重要性不言而喻。...通过本教程的学习,你将能熟练地运用JavaScript模块化开发,打造高效、整洁的前端项目。

    浅析AMD CMD CommonJS规范--javascript模块化加载学习心得总结.docx

    ### 浅析AMD、CMD与CommonJS规范——JavaScript模块化加载学习心得总结 #### 一、引言 在现代Web开发中,随着项目规模的不断扩大和技术复杂度的提高,JavaScript模块化成为了一种非常重要的编程实践。通过将复杂的...

    javascript模块化编程库require的用法.docx

    ### JavaScript模块化编程库Require.js的使用方法 #### 引言 随着Web应用的日益复杂,传统的JavaScript开发方式已无法满足高效开发与维护的需求。在这样的背景下,Require.js作为一种先进的JavaScript模块加载器,...

Global site tag (gtag.js) - Google Analytics