前端模块化开发面试题汇总

首先推荐一个觉得写这方面知识还不错的文章
前端模块化
欢迎大家补充遇到的一些新问题

1.说一说你对前端模块化开发的认识

1.异步模块定义(AMD)规范是require.js 推广的、对模块定义的规范
2.通用模块定义(CMD)规范是SeaJS推广的，对模块定义的规范
3.AMD提前执行，CMD延后执行
4.AMD推荐的风格是通过 module transport 规范暴露接口，即通过返回一个对象暴露模块接口;CommonJS 风格是通过对module.exports 或exports 的属性赋值来达到暴露模块接口的目的。

2.说一说对CommonJS和AMD理解

CommonJS是服务端模块化的规范，Node.js采用了这个规范。CommonJS规范同步加载模块，也就是说只有加载完成，才能执行后面的操作。他的风格是通过对module.exports或exports的属性赋值来达到暴露模块对象的目的
AMD是非同步载模块，允许指定回调函数。他推荐的风格是通过module transport来暴露模块接口。

3.模块化开发的好处

在web开发中，通常将项目的实现划分成好几个模块，模块化开发其实就是将相关功能代码封装到一块，方便维护和重用，不同模块之间通过API进行通信

4.require.js解决了什么问题

1.实现了JavaScript文件的异步加载
2.有助于管理模块之间的依赖性
3.便于代码的编写和维护

5.前端模块化解决了哪些问题?

1.各个模块命名空间独立，A模块的变量x不会覆盖B模块的变量x
2.模块的依赖关系，通过模块管理工具（webpack requires.js等）进行管理

6.如何实现前端模块化开发

requires.js、SeaJS都是适用于web浏览器端的模块加载器，使用他们可以更好的组织javascript代码

7.模块化的javascript开发的优势是什么

1.将功能分离出来
2.具有更好的代码组织方式
3.可以按需加载
4.避免了命名冲突
5.解决了依赖管理问题

8.你了解CommonJS规范吗

定义模块，即一个单独的文件就是一个模块，文件中的作用域独立，文件中定义的变量是无法 被其他文件引用的，如果需要使用这些变量，需要将其定义为全局变量
输出模块指模块只有一个接口对象，即使用module.exports 对象可以将输出的内容放到该对象当中去
加载模块指通过requires加载，例如

var module=require('/module.js')

该module的值对应文件内部的module exports对象，然后就可以通过module名称引用模块中暴露出来的接口变量或接口函数了

9.谈谈你对CMD（Common module Definition,通用模块）规范的理解

就近依赖，需要时再加载嘛，所以执行顺序和书写顺序一致；这一点与AMD不同，AMD是在使用模块之前将依赖全部加载完成，但是由于网络原因等其他因素可能导致模块下载的先后顺序不一致，这就造成执行顺序可能和书写顺序不一致

（这里想到了另一个知识点
Js 延迟加载有助于提高页面的加载速度。
方法有：defer、async、动态创建DOM方式（用的最多）、按需异步载入JS（把js外部引入的文件放到页面底部，来让js最后引入，从而加快页面加载速度）、使用setTimeout延迟方法

defer：延迟脚本。立即下载，但是延迟执行（延迟到整个页面都解析完毕后再运行），按照脚本出现的先后顺序执行
async：异步脚本下载完立即执行，但不保证按照脚本出现的先后顺序执行。
async和defer一样，都不会阻塞其他资源下载，所以不会影响页面的加载。 ）

10.你了解过EMAScript 6模块规范吗？

1.类似于CommonJS，但是语法更简单
2.类似于AMD，直接支持异步加载和配置模块加载
3.对于结构可以做静态分析、静态检测
4.比CommonJS更好的支持循环依赖

11.为什么要通过模块化进行开发

1.高内聚低耦合，有利于团队开发。当模块很复杂时，可以将项目划分为不同模块分给多人一起开发，最后再组合在一起，这里可以降低模块与模块之间的依赖关系，实现低耦合，模块中又有特定功能实现高内聚低耦合
2.可以重用，方便维护。模块的功能就是有特定功能，当两个项目都需要某种功能时，定义一个特定的模块来实现该功能，这样只需要在需要的两个项目中都引入这个模块就可以实现，不需要写重复代码。
另外当需要变更的时候直接修复该模块代码即可，方便维护

12.ADM 和CMD的区别是什么

ADM是require.js 推广的，异步加载模块，通过module transport来暴露接口，提前执行
CMD是SeaJS推广的，同步加载模块，通过对 module exports 或 exports属性赋值来暴露接口，延迟执行
CMD推崇依赖就近，ADM推崇依赖前置

13.前端模块化是否等同于 javascript 模块化

前端开发相对于其他语言的开发比较特殊，我们实现一个页面的功能总是需要HTML、CSS 、Javascript三者交织而成
如果一个功能只有Javascript实现了模块化，CSS 和Template都还处于原始状态，那么调动这个功能的时候并不能完全通过模块化的方式，这样的模块化方案是不完整的
所以我们真正需要的是将HTML、CSS 、Javascript这三个都考虑进去的模块化方案。

14.Javascript 模块化是否等同于异步模块化

主流的Javascript模块化方案都使用"异步模块定义"的方式，这种方式给开发带来了极大的不便，所有的同步代码都需要修改为异步方式。
当前前端开发中使用"CommonJS"模块化开发规范时，开发者可以使用自然，容易理解的模块定义和调用方式，不要关注模块是否异步，不需要改变开发者的开发行为。因此Javascript模块化开发并不等同于异步模块开发

15.require.js 与SeaJS的异同是什么

相同：都是模块加载器，倡导的是模块化开发理念，核心理念都是让Javascript模块化开发变得简单自然
不同：
1.定位有差异。require.js想成为浏览器端的模块加载器，同时也想成为node等环境的模块加载器。SeaJS则专注于成为web浏览器端，同时通过node扩展的方式可以很方便地运行在Node服务器端
2.遵循规范不同，require.js遵循的是AMD规范，SeaJS遵循的是CDM规范。规范的不同导致了两者的API不同，SeaJS更加简洁优雅，更贴近CommonJS Modules/1.1和Node Modules规范
3.require.js尝试让第三方类库修改自身来支持require.js。SeaJS不强推，采用自主封装的方式来海纳百川

16.系统在设计上遵循几个原则

1.在编译时纳入所有依赖
2.去中心化，实现分布式
3.内置命名和封装、

17.什么是模块化规范

服务端的模块化规范主要是CommonJS，Node.js用的就是CommonJS规范客户端。
AMD推崇依赖前置， CMD推崇依赖就近。
AMD规范的实现主要有require.js,CMD规范的主要实现有SeaJS。但是SeaJS已经停止维护了，因为在EMAScript6中提供了EMAScript Module模块规范化，随着EMAScript6的普及，第三方模块化规范的实现会慢慢地被淘汰

18.requireJS的核心原理是什么？（如何动态加载的？如何避免多次加载的？如何缓存的？）

核心是js的加载模块，通过正则匹配模块以及模块的依赖关系，保证文件加载的先后顺序，根据文件的路径对加载过的文件做了缓存。