博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AMD的学习笔记
阅读量:6388 次
发布时间:2019-06-23

本文共 1479 字,大约阅读时间需要 4 分钟。

模块化

  js在诞生之初,本来只是用来作为表单交互的一个脚本语言,只需要很简单的定义一些方法即可完成他的使命。所以在那个阶段,前端代码非常简洁,规模很小,逻辑关系简单。但随着js的发展,它需要处理的事情越来越多,并且随着nodejs的诞生,js不仅要处理浏览器客户端的事务,还需要去处理服务器端的数据处理逻辑,这极大的增加了代码的规模,将如此庞大的代码放在一个JS文件里面,让逻辑变得混乱不堪,难以维护。而原生的JS又不具备处理大规模代码的能力,于是开发人员为了提高开发的效率和代码的可维护性,开始在前端引入了模块化的概念。

  在我看来,所谓的模块,就是一个文件,每个文件内部是一个完整的功能代码段,即每个文件实现一个相对独立的功能,而且内部使用自己的作用域,通过暴露自己的内部方法,让其它模块可以使用其内部定义的方法和变量。比如在commonJS里面,通过define定义一个模块,在模块内部使用export暴露其内部的方法和变量,在模块中通过require引入其它模块。这就和拼积木的思想是类似的,每个模块都是一块积木,我们的WEB应用就是通过将不同的模块拼接在一起形成的完整的个体。

  模块化的精髓就在于,我们通过模块将代码拆分开来,实现了代码的复用,增加了可维护性,同时解除了代码的耦合,有利于团队的分工合作,提高了开发的效率。

 

AMD

是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。它是 RequireJS 在推广过程中对模块定义的规范化产出。也就是说,AMD是一种规范,是Require秉承的一种模块化的理念,我们使用RequireJS进行模块化开发,就是按AMD规定的套路在走。

AMD规范下的模块化开发有哪些特点?

1.AMD异步加载模块,适合于浏览器端的模块化开发。

  所谓的异步加载,即加载模块的时候不会阻塞浏览器的运行。

 

2.AMD中依赖的模块,是需要预先在定义的时候就写清楚,并提前执行的。而提前执行(个人理解)指的是define定义的时候,其回调函数function(a,b){}需要等待其依赖的模块加载和执行完毕后才会执行。也就是依赖的模块在回调函数之前执行。(虽然也支持像CMD这样按需加载,但是AMD的官方是推荐在定义时确定依赖关系)

 

3.AMD使用define定义模块,使用require加载模块。

模块定义的一个基本形式为:

define(name,[依赖1,依赖2,依赖3...],函数)

(这里省略了模块名,会默认将文件名作为模块名)

define(['./a', './b'], function(a, b) {  // 依赖必须一开始就写好    a.doSomething()    // 此处略去 100 行    b.doSomething()    ...})

 如上所示,通过数组字面量的形式在定义模块的时候写明了依赖的两个模块。

模块加载的一个基本形式:

require([module], callback);

第一个参数[module],是一个数组,里面的成员就是要加载的模块;第二个参数callback,则是加载成功之后的回调函数。

require(['math'], function (math) {   math.add(2, 3);});

这里面的['math']就是加载了math模块,后面是加载成功后的回调函数。

转载于:https://www.cnblogs.com/zhangjunfeng/p/6600983.html

你可能感兴趣的文章
我个人的javascript和css命名规范
查看>>
android ANR产生原因和解决办法
查看>>
kylin的安装与配置
查看>>
我的java学习之路--Reflect专题
查看>>
Android Intent的setClass和setClassName的区别
查看>>
php-fpm nginx 使用 curl 请求 https 出现 502 错误
查看>>
西宁海关首次对外展示截获500余件有害生物标本
查看>>
泸州移动能源产业园首片薄膜电池组件成功下线
查看>>
韩国瑜会见陆委会主委陈明通:别给高雄念紧箍咒
查看>>
交通部:加大人工售票力度保障农民工春运出行
查看>>
一位汽车媒体人的心声:这年头,选车比选老婆都难!
查看>>
物联网的学术层、应用层和行为层的基本介绍
查看>>
初探github(一)
查看>>
源码分析之 LinkedList
查看>>
免SDK实现微信/支付宝转账打赏功能
查看>>
安卓.9图片制作
查看>>
MySQL 高可用性keepalived+mysql双主
查看>>
Python环境安装及数据基本预处理-大数据ML样本集案例实战
查看>>
07-const
查看>>
GraphQL学习:Github GraphQL API v4初探
查看>>