在线客服
扫描二维码
下载博学谷APP扫描二维码
关注博学谷微信公众号
随着Web2.0时代的到来,使用模块化规范进行管理成为许多人开始考虑的想法。本文为大家整理总结了前端模块化的相关面试题,大家可以借此机会把模块化的相关知识点梳理一遍。了解异步模块加载机制、使用模块化的原模块化的优缺点等等内容。希望本文可以让大家彻底掌握前端模块化的相关面试题!
1、对 AMD,CMD,CommonJs 有什么理解?
AMD 规范即异步模块加载机制。从规范描述页面看,AMD 很短也很简单,但却完整描述了模块的定义,依赖关系,引用关系以及加载机制。 AMD 规范其实只有一个主要接口 define(id,dependencies,factory),它要在声明模块的时候指定所有的依赖dependencies,并且还要当做形参传到factory中,对于依赖的模块提前执行,依赖前置
define("module", ["dep1", "dep2"], function(d1, d2) { return someExportedValue;
});
require(["module", "../file"], function(module, file) { /* ... */ });
优点:适合在浏览器环境异步加载;并行加载多个模块。
缺点:提高开发成本,代码阅读和书写比较困难;不符合通用的模块思维方式,是一种妥协的实现。
实现:requireJS,NodeJs,Dojo,JQuery
CMD 规范和 AMD 相似,尽量保持简单,并且与 CommonJS 和 NodeJS 的
Modules 规范保持了很大的兼容性。在 CMD 中,一个模块就是一个文件, 格式为:define( factory )
define("module", ["dep1", "dep2"], function(d1, d2) {
return someExportedValue;
});
require(["module", "../file"], function(module, file) { /* ... */
});
优点:依赖就近,延迟执行;很容易在 node 中运行。
缺点:依赖 SPM 打包,模块的加载逻辑偏重。
实现:SeaJS
CommonJS 是在浏览器环境之外构建 JavaScript 生态系统为目标产生的项目,比如服务器和桌面环境中。CommonJS 规范是为了解决 JavaScript 的作用域问题而定义的模块形式,可以使每个模块在它自身的命名空间中执行。该规范的主要内容是:模块必须通过 module.exports 导出对外的变量或接口,通过 require()来导入其他模块的输出到当前模块。
//moduleA.js
module.exports =
function( value ){
return
value
*
2;
}
// moduleB.js
var multiplyBy2 = require('./moduleA');
var result = multiplyBy2(4);
CommonJS 是同步加载模块,一个单独的文件就是一个模块。但其实也有浏览器端的实现,其原理是将所有模块都定义好并通过 id 进行索引,
这样就可以浏览器进行解析了 服务器端的 Node.js 遵循 CommonJS 规范。核心思想是允许模块通过 require 方法来同步加载所要依赖的其他模块,然后通过 exports 或 module.exports 来导出需要暴露的接口。
require("module");
require("../file.js");
exports.doStuff = function() {};
module.exports = someValue;
优点:服务器端便于重用;NPM 中已经将近 20w 个模块包;简单并容易使用。
缺点:同步的模块方式不适合在浏览器环境中,同步意味着阻塞加载, 浏览器资源是异步加载的;不能非阻塞的并行加载多个模块。
区别:(AMD or CMD)
2、为什么要模块化?不用的时候和用RequireJS的时候代码该如何书写?
(1)方便大量的 js 脚本代码的管理维护以及团队配合开发;
(2)有效解决命名空间冲突及文件依赖加载顺序问题;
(3)有利于模块的版本管理,提高可维护性,有利于前端性能优化,跨环境共享模块。
3、分别说说同步和异步模块化的应用场景,说一下AMD 异步模块化实现的原理?
引入 JS 时会遇到需要异步加载文件,此时 require.async 便可满足异步加载需求。
以上就是前端模块化相关面试题整理,大家都弄清楚了吗?关于前端模块化的复习梳理就到这里了,希望本文对大家能够有所帮助。
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
前端工程师应该避免的几个思维误区
前端工程师属于高薪行业,但是同时进入企业的一批前端工程师,在1-3年的发展过程中,就会出现分化,有的程序员依旧是程序员,而也有的成为了项目经理。那是因为什么导致了这样的分化呢?今天博学谷小编就和大家分享一下前端工程师应该避免的几个思维误区。
8714
2019-08-09 18:03:39
CSS六大基本选择器介绍
CSS是一种格式化网页的标准方式,用于设置网页的样式,并允许样式信息与网页内容分离的一种技术。要使用CSS对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。本文将向大家介绍六大基本选择器,即元素选择器、类选择器、ID选择器、通用选择器、伪类选择器、伪元素选择器。
6338
2019-08-12 17:58:27
前端面试被问到项目中的难点有哪些?
在每个前端求职者的面试过程中,一定都有过被面试官问到项目中的难点,而答不上来的情况。为了让大家在前端面试前准备得更加充足,小编准备了一些易被忽视且难度较高的前端面试题,希望可以帮助大家更加顺利完成求职,找到自己满意的工作。
39224
2019-10-08 19:02:38
常见三大缓存问题分析及解决方案
一般来讲,常见三大缓存问题不外乎就是缓存穿透、缓存击穿、缓存雪崩。三者的共同点都是高并发,缓存更新、缓存失效居多。而且三者也会相互恶化,导致问题更加严重,因此一旦有一个问题就需要马上解决,以免最引起“雪崩”。本文将分别分析缓存并发、缓存雪崩、缓存击穿三大问题,并提出对应的解决方案。
7710
2019-11-01 18:23:18
菜鸟学习前端的方法分享
许多想要投身于前端行业的初学者常常会困扰:如何学习前端?从哪里开始入手学习?前端要学哪些内容?为了一次性解决大家对于入门前端的问题,本文将分享给大家一些菜鸟学习前端的方法,包括前端学习的误区、学习的内容等等。如果你想快速入门前端,就赶紧接着看下去吧!
4199
2020-07-22 18:27:41