前端面试题库及答案

前端面试题库及答案前言本题库针对前端开发岗位面试高频考点设计，涵盖HTML/CSS/JavaScript基础、框架应用、工程化实践、性能优化等核心领域，包含单项选择、多项选择、判断及简答题共70题，附标准答案题目紧密结合行业实际面试场景，答案简洁准确，适合求职者自测复习或面试前系统梳理知识点

一、单项选择题（共30题，每题1分）

1.HTML5新增的哪个API用于在客户端存储大量结构化数据（如JSON），且支持异步操作？A.localStorageB.sessionStorageC.cookieD.IndexedDB答案D

2.CSS中，以下哪个属性用于控制元素在垂直方向的对齐方式？A.text-alignB.vertical-alignC.line-heightD.justify-content答案B

3.JavaScript中，以下哪个方法可用于数组去重？A.Array.prototype.includesB.Array.prototype.indexOfC.Array.prototype.filter第1页共11页D.Array.prototype.reduce答案D

4.浏览器的“回流（Reflow）”和“重绘（Repaint）”中，哪项操作代价更高？A.回流B.重绘C.两者代价相同D.取决于元素大小答案A

5.以下哪个不是JavaScript的原始数据类型？A.StringB.NumberC.ObjectD.Boolean答案C

6.CSS Flexbox布局中，哪个属性用于定义项目在主轴上的排列方式？A.flex-directionB.justify-contentC.align-itemsD.flex-wrap答案B

7.浏览器的“事件冒泡”指的是？A.事件从目标元素向上传播至根节点B.事件从根节点向下传播至目标元素第2页共11页C.事件在目标元素内部触发后停止D.事件在多个元素间触发答案A

8.以下哪个是ES6引入的箭头函数特性？A.拥有自己的this绑定B.必须使用function关键字定义C.可以显式返回对象字面量（需加括号）D.不能作为构造函数使用答案D

9.前端工程化中，“webpack”的主要作用是？A.处理CSS预编译B.模块化打包与依赖管理C.实现热更新D.优化图片资源答案B

10.以下哪个不是HTTP请求方法？A.GETB.POSTC.PATCHD.RENDER答案D

11.DOM中，哪个方法用于创建新的DOM元素？A.document.createElementB.document.appendChildC.document.getElementById第3页共11页D.document.querySelector答案A

12.CSS Grid布局与Flexbox布局的主要区别是？A.Grid用于一维布局，Flexbox用于二维布局B.Grid用于二维布局，Flexbox用于一维布局C.Grid性能优于FlexboxD.Grid兼容性更好答案B

13.JavaScript中，“闭包”的主要作用是？A.提高代码执行速度B.保护函数内部变量不被外部访问C.简化函数调用D.减少内存占用答案B

14.浏览器的“同源策略”不限制以下哪种资源请求？A.HTML文件B.CSS文件C.跨域图片D.跨域AJAX请求答案C

15.以下哪个不是React的核心概念？A.Virtual DOMB.单向数据流C.双向数据绑定D.组件化第4页共11页答案C

16.CSS中，“box-sizing:border-box”的含义是？A.元素宽度包含padding和borderB.元素宽度仅包含内容区C.元素高度包含marginD.元素尺寸以屏幕宽度为基准答案A

17.JavaScript中，“async/await”语法的作用是？A.替代for循环B.简化异步代码的书写C.提高函数执行效率D.实现同步阻塞答案B

18.前端性能优化中，“懒加载”主要优化的是？A.首屏加载速度B.图片资源体积C.JS文件加载时间D.服务器响应速度答案A

19.以下哪个不是HTML5语义化标签？A.B.C.D.答案C第5页共11页

20.CSS中，“@media”查询的作用是？A.定义动画效果B.实现响应式布局C.引入外部样式表D.定义字体样式答案B

21.JavaScript中，“this”关键字的指向取决于？A.函数定义时的作用域B.函数调用时的上下文对象C.是否使用箭头函数D.变量声明的位置答案B

22.以下哪个不是HTTP状态码2xx的含义？A.成功请求B.资源已创建C.服务器错误D.操作成功接收答案C

23.Vue中，“v-model”指令的作用是？A.绑定元素属性B.实现双向数据绑定C.条件渲染元素D.循环渲染列表答案B第6页共11页

24.浏览器的“缓存机制”中，哪个头字段用于控制缓存是否强制失效？A.Cache-Control:no-cacheB.ExpiresC.Last-ModifiedD.ETag答案A

25.JavaScript中，“Promise”的“then”方法返回的是？A.原Promise对象B.新的Promise对象C.异步操作的结果值D.同步执行的结果答案B

26.CSS中，“transform:translate10px,20px”的作用是？A.移动元素位置B.改变元素尺寸C.旋转元素D.缩放元素答案A

27.前端模块化方案中，“CommonJS”和“ES Module”的主要区别是？A.CommonJS同步加载，ES Module异步加载B.CommonJS使用export/import，ES Module使用require/module.exportsC.CommonJS支持循环依赖，ES Module不支持第7页共11页D.CommonJS运行时加载，ES Module编译时加载答案D

28.以下哪个不是浏览器的组成部分？A.渲染引擎B.JavaScript引擎C.数据库引擎D.网络引擎答案C

29.CSS中，“transition”和“animation”的主要区别是？A.transition需要触发条件，animation可自动执行B.transition执行一次，animation可循环C.transition支持更多动画属性D.transition性能优于animation答案B

30.JavaScript中，“Array.prototype.map”的返回值是？A.原数组B.处理后的新数组C.布尔值D.undefined

二、多项选择题（共20题，每题2分）

1.以下属于前端开发核心技术栈的有？A.HTMLB.CSSC.JavaScriptD.Python第8页共11页答案ABC

2.以下哪些是CSS选择器类型？A.元素选择器B.类选择器C.ID选择器D.后代选择器答案ABCD

3.JavaScript中，以下哪些方法可用于操作数组？A.pushB.popC.shiftD.unshift答案ABCD

4.前端工程化工具包括？A.webpackB.babelC.eslintD.npm答案ABCD

5.浏览器的“回流”可能由以下哪些操作触发？A.修改元素尺寸B.添加/删除DOM节点C.修改元素颜色D.改变窗口大小答案ABD第9页共11页

6.以下属于HTTP请求头字段的有？A.HostB.Content-TypeC.Set-CookieD.User-Agent答案ABD

7.Vue的核心特性包括？A.双向数据绑定B.组件化C.虚拟DOMD.响应式原理答案ABD

8.以下哪些属于JavaScript的异步编程方案？A.callbackB.PromiseC.async/awaitD.setTimeout答案ABCD

9.CSS Flexbox布局的常用属性有？A.display:flexB.justify-contentC.align-itemsD.flex-direction答案ABCD

10.前端性能指标包括？第10页共11页A.FCP（首次内容绘制）B.LCP（最大内容绘制）C.TTI（交互时间）D.TTFB（首字节时间）答案ABC

11.以下属于HTML5新特性的有？A.语义化标签B.本地存储C.Web WorkersD.WebSocket答案ABCD

12.JavaScript中的“原型链”特点包括？A.基于对象的继承B.向上查找属性C.动态原型更新D.所有对象共享原型答案ABC第11页共11页。