前端程序员面试分类真题18

前端程序员面试分类真题18一、单项选择题1.

敏捷软件开发方法是一种______A.数学观B.建模观C.工程观D.协作观正确答案：D[考点]软件开发方法[解析]敏捷软件开发方法是一种（江南博哥）应对快速变化的需求的软件开发能力。它们的具体名称、理念、过程和术语都不尽相同。相对于“非敏捷”，敏捷更强调程序员团队与业务专家之间的紧密协作、面对面的沟通(认为比书面的文档更有效)、频繁交付新的软件版本、紧凑而自我组织型的团队、能够很好地适应需求变化的代码编写和团队组织方法，也更注重软件开发中人的作用。所以，敏捷软件开发方法是一种创作与交流的协作观，选项D正确。

2.

极限编程XP的核心思想是______A.强调文档和以敏捷性应对变化B.强调建模和以敏捷性应对变化C.强调设计和以敏捷性应对变化D.强调人与人之间的合作因素和以敏捷性应对变化正确答案：D[考点]软件开发方法[解析]极限编程(ExtremeProgramming，XP)是一种轻量级的、灵巧的软件开发方法，同时，它也是一种非常严谨和周密的方法。它的基础和价值观是交流、朴素、反馈和勇气，即任何一个软件项目都可以从四个方面入手进行改善：加强交流；从简单做起；寻求反馈；勇于实事求是。它是敏捷开发的典型代表，其核心思想是强调人与人之间的合作因素和以敏捷性应对变化。所以，选项D正确。

3.

软件复用是使用已有的软件产品(例如设计、代码和文档等)来开发新的软件系统的过程。为了提高构件(Component)的复用率，通常要求构件具有较好的______A.专用性和不变性B.专用性和可变性C.通用性和不变性D.通用性和可变性正确答案：C[考点]软件开发方法[解析]软件复用(SoftwareReuse)是将已有软件的各种有关知识用于建立新的软件，以缩减软件开发和维护的花费。为了提高构件的复用率，通常要求构件具有较好的通用性与不变性。所以，选项C正确。

4.

以下方法中，既可以用于黑盒测试，也可以用于白盒测试的是______A.逻辑覆盖法B.边界值法C.基本路径法D.正交试验设计法正确答案：B[考点]软件测试[解析]通常，软件测试包含黑盒测试与白盒测试，其中，黑盒测试也称为功能测试，它是通过测试来检测每个功能是否都能正常使用。在测试中，把程序看作一个不能打开的黑盒子，在完全不考虑程序内部结构和内部特性的情况下，在程序接口进行测试，它只检查程序功能是否能够按照需求规格说明书的规定正常使用，程序是否能适当地接收输入数据并产生正确的输出信息。黑盒测试着眼于程序外部结构，不考虑内部逻辑结构，主要针对软件界面和软件功能进行测试。

白盒测试也称结构测试、透明盒测试、逻辑驱动测试或基于代码的测试。白盒测试的测试方法有代码检查法、静态结构分析法、静态质量度量法、逻辑覆盖法、基本路径测试法、域测试、符号测试、路径覆盖和程序变异。

对于选项A，逻辑覆盖法是以程序内部的逻辑结构为基础来设计测试用例的技术，它属于白盒测试。所以，选项A错误。

对于选项B，边界是指相对于输入等价类和输出等价类而言，稍高于其边界值及稍低于其边界值的一些特定情况。基于边界的方法是根据定义域来实现的，最终演变成边界值分析、健壮性测试、最坏情况测试、健壮最坏情况测试等技术。边界值分析是对等价类分析方法的一种补充，既可以用于黑盒测试用例，也可以用于白盒测试用例。所以，选项B正确。

对于选项C，基本路径测试法是在程序控制流图的基础上，通过分析控制构造的环路复杂性，导出基本可执行的路径集合，从而设计测试用例的方法。它通常用于白盒测试。所以，选项C错误。

对于选项D，正交试验设计法是研究多因素多水平的一种设计方法，它是根据正交性从全面试验中挑选出部分有代表性的点进行试验，这些有代表性的点具备了“均匀分散，齐整可比”的特点，就是使用已经造好了的表格(正交表)来安排试验并进行数据分析。它简单易行，高效、快速、经济，计算表格化，使用者能够迅速掌握。它通常用于黑盒测试。所以，选项D错误。

因此，本题的答案为B。

5.

在下面所列举的逻辑测试覆盖中，测试覆盖最严格的是______A.条件覆盖B.条件组合覆盖C.语句覆盖D.条件及判定覆盖正确答案：B[考点]软件测试[解析]白盒测试法有代码检查法、静态结构分析法、静态质量度量法、逻辑覆盖法、基本路径测试法、域测试、符号测试、Z路径覆盖和程序变异。

白盒测试法的覆盖标准有逻辑覆盖、循环覆盖和基本路径测试。逻辑覆盖是以程序内部的逻辑结构为基础来设计测试用例的技术，是白盒测试法常用的技术，主要的覆盖标准有6种，强度由弱到强依次是：语句覆盖、判定覆盖、条件覆盖、判定/条件覆盖、条件组合覆盖和路径覆盖。所以，选项B正确。

6.

从测试阶段角度看，测试结束的正确顺序是______A.单元测试，集成测试，系统测试，确认测试B.单元测试，系统测试，集成测试，确认测试C.确认测试，集成测试，系统测试，单元测试D.确认测试，系统测试，集成测试，单元测试正确答案：A[考点]软件测试[解析]从整体的角度看，软件测试可以分为单元测试、集成测试、系统测试和确认测试。

单元测试(又称为模块测试)是针对程序模块(软件设计的最小单位)来进行正确性检验的测试工作。

集成测试也叫组装测试、联合测试、子系统测试或部件测试。集成测试是在单元测试的基础上，将所有模块按照概要设计要求组装成为子系统或系统，进行集成测试。

系统测试是在所有单元、集成测试后，对系统的功能及性能进行的总体测试。

确认测试又称为有效性测试。有效性测试是在模拟的环境下，运用黑盒测试的方法，验证被测软件是否满足需求规格说明书列出的需求。

从测试阶段角度，测试结束的正确顺序应该是单元测试、集成测试、系统测试和确认测试。所以，选项A正确。

二、多项选择题1.

软件工程里面常用的生命周期模型包括______A.瀑布模型B.迭代模型C.原型模型D.增量模型正确答案：ABCD[考点]软件开发方法[解析]软件工程里面常用的生命周期模型包括瀑布模型、迭代模型、快速原型模型和增量模型等。所以，选项A、选项B、选项C和选项D都正确。

2.

软件的六大质量特性不包括______A.功能性B.可靠性C.兼容性D.稳定性正确答案：CD[考点]软件开发方法[解析]软件的六大质量特性包括功能性、可靠性、可用性、效率、可维护性和可移植性。很显然，兼容性与稳定性不属于软件的六大质量特性。所以，选项C与选项D正确。

3.

下列属于单元测试对象的是______A.软件构件B.计算机系统C.类D.可独立编译的程序模块正确答案：ACD[考点]软件测试[解析]单元测试的对象是软件设计的最小单位——模块。本题中，软件构件、类、可独立编译的程序模块都属于单元测试的对象，所以选项A、选项C和选项D正确。而计算机系统不属于模块，它不是单元测试的对象，所以选项B错误。

4.

单元测试的任务包括______A.模块接口和边界条件测试B.模块局部数据结构测试C.模块的各条错误处理通路测试D.模块中所有独立执行通路测试正确答案：ABCD[考点]软件测试[解析]单元测试处于软件测试初期阶段，任务主要包括：模块接口测试、模块局部数据结构测试、模块中所有独立执行通路测试、模块的各条错误处理通路测试和模块边界条件测试。所以，选项A、选项B、选项C和选项D都正确。

5.

软件测试计划评审会需要参加的人包括______A.项目经理B.SQA负责人C.配置负责人D.测试组正确答案：ABCD[考点]软件测试[解析]软件测试计划是描述测试目的、范围、方法和软件测试重点等的文档。对于验证软件产品的可接受程度，编写测试计划文档是一种有用的方式。软件测试计划评审会需要项目经理、SQA(SoftwareQualityAssurance，软件质量保证)负责人、配置负责人和测试组人员参加。所以，选项A、选项B、选项C和选项D正确。

三、简答题1.

前端为什么提倡模块化开发?正确答案：模块化能将一个复杂的大型系统分解成一个个高内聚、低耦合的简单模块，并且每个模块都是独立的，用于完成特定的功能。模块化后的系统变得更加可控、可维护、可扩展，程序代码也更简单直观，可读性也更高，有利于团队协作开发。自动化构建工具的出现，使得前端能更容易、更快速地实现模块化开发。[考点]软件开发方法

2.

有没有用过自动化构建工具?如果用过，那么请对其做简单的描述。正确答案：用过。自动化构建工具能够增强前端的工作流程，避免重复而繁杂的任务，提升开发效率，保持项目可维护和可扩展等。常用的构建工具有Gulp、Grunt等，它们支持页面监控、自动刷新、文件压缩与合并等功能，让开发人员能更简单、更高质量地完成工作。[考点]软件开发方法

3.

什么是MVVM模式?正确答案：MVVM模式由三部分组成：模型(Model)、视图(View)和视图模型(ViewModel)。模型封装了数据逻辑，视图用于界面呈现，视图模型为视图绑定数据并实现交互。一个视图模型能对应多个视图和模型，这使得视图模型中的代码高度可复用，并且便于单元测试。视图的独立开发还能让不会使用JavaScript的人，只要按照视图的规范就能构建出复杂的页面。目前采用MVVM模式的框架有VUE、Angular和Avalon等。[考点]软件开发方法

4.

移动端的屏幕种类众多，你是怎么适配它们的?正确答案：首先控制视口的尺寸和缩放级别，并且禁止手动缩放(如以下代码所示)，使得页面能在移动设备中正确显示。

＜metaname="viewport"

content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/＞

然后用相对单位rem对页面进行布局，单位是rem的值会参照根元素(也就是html元素)的字体大小进行计算，这样就能保证在各种尺寸的屏幕中呈现比较一致的视觉效果。要实现这种弹性布局，对根元素设置合适的字体大小是关键。目前对它的计算方式有多种，可以先预设两个值：视口的参照宽度(即设计稿的宽度)和根元素的参照字体大小，例如把这两个值设为640和100，计算代码如下所示，其中window.innerWidth读取的是视口的实际宽度。

functionresize(){

vardesignWidth=640,

baseSize=100,

html=document.documentElement;

html.style.fontSize=window.innerWidtn*baseSize/designWidth+"px";

}

resize();

接着把这段代码加在合适的事件中再执行一次(例如下面的DOMContentLoaded事件)，保证能读取到视口的实际宽度。

document.addEventListener("DOMContentLoaded",function(){

resize();

});

最后将上述两段代码放置在CSS文件之前，保证在加载CSS的时候，根元素已经被设置了合适的字体大小。这是一种比较简单的适配方案，如果要想让界面更加细腻，可以把设备像素比也纳入到计算中。[考点]软件开发方法

5.

请简单介绍一下图像的预加载和懒加载。正确答案：图像预加载是指提前加载图像，并将其缓存，当要访问时就能直接读取缓存中的图像。预加载不但能更流畅地展示网页，减少等待时间，还能防止页面因图像太多而打开缓慢甚至无法打开的情况发生。图像懒加载也叫延迟加载，通常的做法是当滚动条到达某个位置(可以是网页底部)时，再请求图像。这种方式能大大节约用户的流量，并能减轻服务器的压力，提升用户体验。[考点]Web性能和安全

6.

CDN是什么?正确答案：CDN(ContentDeliveryNetwork)即内容分发网络，它是在现有的互联网基础之上再构建的一层智能虚拟网络(包括分布式存储、负载均衡、请求重定向和内容管理等)，通过在各地放置节点服务器实现。其目的是降低访问延时，避开影响传输速度与稳定性的瓶颈和环节，从而提升用户访问网站的响应速度和成功率。CDN能实时地根据网络流量、负载状态、用户的距离和响应时间等综合信息，把用户的请求导向离他最近的节点服务器上，使用户能就近获取所需的内容。[考点]Web性能和安全

7.

平时会用到哪些方法来优化页面的性能?正确答案：平时的优化除了会参考雅虎的优化建议之外，还会根据实际情况做些调整，具体如下所列：

(1)网站中的图像放置在专门的图像服务器中，开辟多个不用传Cookie的子域名，这些子域名都能访问该服务器中的图像。

(2)优化请求，包括合并文件、缓存资源、使用CDN、减小Cookie、启用GZip压缩和长连接等。

(3)优化CSS，包括将CSS文件置于HTML文档的顶部、使用外部样式、压缩CSS文件等。

(4)优化JavaScript，包括减少重绘与重排、避免内联脚本阻塞并行下载、批量执行DOM操作、把脚本置于HTML文档底部等。

(5)优化图像，包括压缩、合并、预加载、懒加载和使用WebP格式等。[考点]Web性能和安全

8.

页面性能分析一般会关注哪些参数?正确答案：页面性能的参数一般包括以下几部分：

(1)请求时间相关的参数，包括白屏时间、加载总时间、DNS查询耗时和TTFB(读取页面第一个字节的时间)等。

(2)资源载入信息，通常是以瀑布图的形式展现，包括资源地址、载入耗时、TTFB和TCP连接耗时等。

(3)网络的状态和速度。

(4)代理信息，包括操作系统、设备和浏览器等。

(5)Ajax请求监控，包括请求地址、请求耗时和传输字节量等。

(6)异常监控，包括异常的提示信息、行数、列数和地址等。[考点]Web性能和安全

9.

请谈谈你用过的性能分析工具。正确答案：曾经用过在线的WebPageTest(),WebPageTest通过布置一些特定的场景进行测试，例如不同的网速、浏览器和位置等，如下图所示。

WebPageTest主界面

测试完成后，能获得优化等级、性能参数、请求瀑布图和网页幻灯片快照等，如下图所示。

分析结果

该工具还支持本地部署和移动设备的测试，通过该工具就能全方位地了解网站的性能，并能制订出有针对性的改进方案。[考点]Web性能和安全

10.

请介绍下HTTP中的Cache-Control首部。正确答案：Cache-Control首部能指定资源处于新鲜状态的秒数(如下所示)，秒数从服务器将资源传来之时算起，用秒数比用具体日期要灵活很多。

Cache-Control:max-age=315360

在Cache-Control首部中，有两个比较容易混淆的值：no-cache和no-store。no-cache字面上比较像禁止资源被缓存，但其实不是，no-store才是这个功能。no-cache可以将资源缓存，只是要先与服务器进行新鲜度再验证，验证通过后才会将其提供给客户端，如下图所示。

no-cache的作用

在通用首部中，还有个历史遗留首部：Pragma。Pragma首部用于实现特定的指令，它也有一个值为no-cache，功能和Cache-Control中的相同，如下所示。

Cache-Control:no-cache

Pragma:no-cache[考点]Web性能和安全

11.

什么叫点击劫持?对这种攻击有什么解决办法?正确答案：点击劫持(clickjacking)是一种视觉上的欺骗，攻击者把一个透明的iframe覆盖在目标网页的某个位置，这个位置可以是一个按钮、一段文字或一张图像等，诱使用户点击。如果要防范该攻击，可以通过限制iframe来实现。只要在HTTP响应报文中增加X-Frame-Options首部，就能让浏览器按照要求加载iframe中的页面，可以是不加载、只加载相同域名或加载指定来源。[考点]Web性能和安全

12.

XSS是什么?对这种攻击有哪些防范办法?正确答案：XSS(CrossSiteScript)即跨站脚本攻击，它将恶意脚本注入到目标网页中，用户在访问该页面时，有可能造成信息泄露、用户行为被劫持、感染并传播蠕虫病毒等危害。防范办法如下所列：

(1)为Cookie添加HttpOnly标记，使得客户端不能通过JavaScript读取Cookie信息。

(2)