Web技术及应用面试试题及答案

Web技术及应用面试试题及答案考试时间：______分钟总分：______分姓名：______1.以下关于HTTP/HTTPS协议的说法，正确的是（）。A.HTTPS默认使用80端口传输数据B.HTTP状态码401表示请求未授权，需要身份验证C.GET请求的参数必须放在URL中，不能放在请求体中D.HTTP/1.1支持持久连接，默认开启长连接2.以下哪些是JavaScript中闭包的典型应用场景？（多选题）A.实现私有变量B.防抖函数C.事件委托D.模块化开发3.在CSS中，关于盒模型的说法，正确的是（）。A.box-sizing:content-box时，元素的width包含padding和borderB.margin会占据父容器空间，影响布局C.外边距（margin）的塌陷发生在垂直方向相邻元素之间D.绝对定位的元素脱离文档流，不影响其他元素布局4.以下关于MySQL索引的说法，错误的是（）。A.索引可以加快查询速度，但会降低写入性能B.复合索引的列顺序不影响查询效率C.使用LIKE'%abc'查询时，索引可能失效D.主键索引自动创建，无需手动指定5.TCP三次握手过程中，以下哪个步骤是正确的？（）。A.客户端发送SYN=1，seq=xB.服务器发送SYN=0，ack=x+1C.客户端发送ACK=0，ack=yD.服务器发送ACK=1，seq=y6.在React中，以下哪些生命周期方法会在组件挂载后调用？（多选题）A.constructorB.componentDidMountC.renderD.componentDidUpdate7.Redis中，以下哪些数据类型支持原子性操作？（多选题）A.StringB.ListC.HashD.Set8.解决跨域问题的方法包括（）。A.JSONPB.CORSC.使用iframe的postMessageD.修改浏览器同源策略9.Webpack中，以下哪些配置可以优化构建速度？（）。A.使用DllPlugin预编译第三方库B.开启source-mapC.减少文件入口数量D.使用thread-loader并行处理10.以下Git命令中，用于创建并切换到新分支的是（）。A.gitcheckout-bbranch-nameB.gitbranchbranch-nameC.gitmergebranch-nameD.gitrebasebranch-name11.简述Vue2和Vue3在响应式原理上的主要区别。12.描述浏览器从输入URL到页面渲染完成的完整流程。13.设计RESTfulAPI时，如何处理资源的增删改查（CRUD）操作？14.解释JavaScript事件循环（EventLoop）的机制，包括宏任务和微任务的区别。15.实现一个throttle（节流）函数，要求支持立即执行选项，并返回取消功能。16.编写一个函数，将嵌套数组扁平化为一维数组（如[1,[2,[3,4],5]]→[1,2,3,4,5]）。17.设计一个用户登录系统，要求：-支持用户名/密码登录；-密码加密存储（如bcrypt）；-防止暴力破解（如限制登录尝试次数）；-支持会话管理（如JWT）；-考虑高并发场景（如秒级1000次登录请求）。试卷答案1.答案：D解析思路：A错误，HTTPS默认使用443端口；B正确，401表示请求未授权；C错误，GET请求参数可以放在请求体中；D正确，HTTP/1.1默认支持持久连接。2.答案：A,B,D解析思路：A正确，闭包可创建私有变量；B正确，防抖函数依赖闭包；C错误，事件委托基于事件冒泡，不依赖闭包；D正确，模块化开发使用闭包封装作用域。3.答案：C解析思路：A错误，box-sizing:content-box时width不包括padding和border；B错误，margin不占据父容器空间；C正确，外边距塌陷发生在垂直方向相邻元素；D错误，绝对定位脱离文档流但影响布局。4.答案：B解析思路：A正确，索引加快查询但降低写入；B错误，复合索引列顺序影响查询效率；C正确，LIKE'%abc'索引可能失效；D错误，主键索引需手动指定。5.答案：A解析思路：三次握手标准流程：客户端SYN=1,seq=x；服务器SYN=1,ACK=1,ack=x+1,seq=y；客户端ACK=1,ack=y+1。A正确，B错误（服务器SYN=1），C错误（客户端ACK=1），D错误（服务器ACK=1,seq=y+1）。6.答案：B,C解析思路：组件挂载后调用componentDidMount（B）和render（C）；constructor在挂载前；updateComponent在更新后。7.答案：A,B,C,D解析思路：所有Redis数据类型支持原子操作：String（INCR），List（LPUSH），Hash（HINCRBY），Set（SADD）。8.答案：A,B,C解析思路：JSONP（A），CORS（B），postMessage（C）是跨域方案；修改浏览器同源策略（D）不可行。9.答案：A,C,D解析思路：DllPlugin（A）预编译减少构建时间；减少入口（C）减少处理；thread-loader（D）并行处理；source-map（B）可能增加构建时间。10.答案：A解析思路：gitcheckout-bbranch-name创建并切换分支；gitbranch创建分支但不切换；merge和rebase用于合并。11.答案：Vue2使用Object.defineProperty实现响应式，Vue3使用Proxy，支持动态属性和更好性能。解析思路：Vue2通过getter/setter劫持属性，Vue3通过Proxy代理整个对象，避免深层监听限制。12.答案：DNS解析→TCP连接→HTTP请求→服务器处理→响应→浏览器渲染（解析HTML/CSS/JS→构建DOM/CSSOM→RenderTree→Layout→Paint）。解析思路：从输入URL开始，依次经历网络层和应用层，浏览器解析资源并渲染页面。13.答案：GET获取资源，POST创建资源，PUT更新资源，DELETE删除资源。解析思路：RESTful原则使用HTTP方法对应CRUD操作，资源通过URL标识。14.答案：事件循环处理宏任务（如setTimeout）和微任务（如Promise），先执行所有微任务再执行下一个宏任务。解析思路：JavaScript单线程，事件循环确保非阻塞执行，微任务优先级高于宏任务。15.答案：functionthrottle(fn,delay,{immediate=false}={}){letlastTime=0;lettimer=null;returnfunction(...args){constnow=Date.now();if(immediate&&now-lastTime>=delay){fn.apply(this,args);lastTime=now;}elseif(now-lastTime>=delay){if(timer)clearTimeout(timer);timer=setTimeout(()=>{fn.apply(this,args);lastTime=now;timer=null;},delay);}};}解析思路：记录上次执行时间，确保函数在指定间隔内只执行一次，支持立即执行和取消（需添加cancel方法）。16.答案：functionflatten(arr){returnarr.reduce((acc,val)=>Array.isArray(val)?acc.concat(flatten(val)):acc.concat(val),[]);