已解析题目
前端工程师相关题目
new 关键字的运行流程?实现一个自己的 new
这题考察 new 的四步语义、原型链绑定、this 绑定和构造函数返回值规则,手写实现要覆盖返回对象的特殊分支。
浏览器强缓存和协商缓存分别依赖哪些 HTTP 头?
浏览器强缓存主要依赖响应头 Cache-Control 和 Expires,协商缓存主要依赖 ETag/If-None-Match 与 Last-Modified/If-Modified-Since。Cache-Control 的优先级通常高于 Expires,ETag 的优先级通常高于 Last-Modified。
强缓存和协商缓存有什么区别?
强缓存和协商缓存的根本区别在于是否向服务器发请求。强缓存有效时浏览器直接使用本地副本;协商缓存需要发条件请求,由服务器判断资源是否变化,未变化返回 304。
CSS 如何实现垂直居中?
CSS 垂直居中没有唯一答案,要根据已知高度、未知高度、单行文本、多行内容、父容器布局和兼容性选择方案。现代布局优先使用 flex 或 grid,特殊场景再考虑 absolute+transform、line-height、table-cell 等方法。
哪些 CSS 属性会触发重排?
会触发重排的 CSS 属性,本质上都是会改变元素几何信息、文档流占位、字体度量、滚动尺寸或布局上下文的属性。典型包括 width、height、margin、padding、border、display、position、top、left、float、font-size、line-height、grid、flex 相关属性等;而 color、background-color 通常只触发重绘,transform、opacity 在合成层上变化时通常可以避开主线程布局。
requestAnimationFrame 属于什么任务,适合解决什么问题?
requestAnimationFrame 不是普通宏任务,也不是微任务,而是浏览器在一次渲染机会中、绘制之前执行的动画帧回调。它适合把视觉更新对齐到屏幕刷新节奏,用来做动画、滚动联动、分批 DOM 更新和避免 setTimeout 与刷新率不一致造成的卡顿。
Vue 父子组件有哪些通信方式?
Vue 父子组件通信最基础的是 props 向下传递数据、emit 向上传递事件;更复杂的场景还包括 v-model 双向约定、slot 和作用域插槽传递渲染能力、ref 与 defineExpose 暴露子组件方法、provide/inject 跨层传递依赖,以及通过 Pinia 或 Vuex 管理跨组件共享状态。
Vue 3 相比 Vue 2 有哪些优势?
Vue 3 相比 Vue 2 的优势主要体现在 Composition API 带来的逻辑组织能力、基于 Proxy 的响应式系统、更好的 TypeScript 支持、更小更可摇树优化的包结构、更快的编译和运行时性能,以及 Fragment、Teleport、Suspense、多 v-model 等工程能力。
CSS 渲染过程是怎样的?
CSS 渲染过程从解析 HTML 和 CSS 开始,浏览器构建 DOM 与 CSSOM,经过级联、继承和选择器匹配计算样式,再生成渲染树,随后执行布局、绘制、栅格化和合成。理解这条链路可以解释为什么 CSS 会阻塞渲染、为什么某些属性触发重排或重绘,以及为什么 transform、opacity 更适合高频动画。
CSRF 的原理、攻击形式和防御方式是什么?
CSRF 是跨站请求伪造,核心是攻击者诱导已登录用户的浏览器向目标站点发起请求,浏览器会自动携带目标站点的 Cookie,从而让服务端误以为请求来自用户本人。常见攻击包括隐藏表单提交、img 或链接触发 GET 请求、跨站 POST 和配合不安全 CORS 的接口调用;防御重点是 SameSite Cookie、CSRF Token、Origin/Referer 校验、避免 GET 改状态和敏感操作二次确认。
影响前端首屏性能的关键因素有哪些?
前端首屏性能受网络链路、服务端响应、资源体积、渲染阻塞 CSS、JavaScript 下载和执行、图像与字体、接口数据依赖、缓存策略、第三方脚本、设备算力和框架水合成本共同影响。优化首屏要围绕关键渲染路径,优先让首屏所需 HTML、关键 CSS、必要 JS、核心数据和 LCP 资源尽快可用。
懒加载和虚拟列表如何优化首屏性能?
懒加载通过延后非首屏图像、组件、路由和数据请求,减少首屏需要下载和执行的资源;虚拟列表通过只渲染视口附近的列表项,减少 DOM 数量、布局计算和绘制成本。两者都能优化首屏,但前提是不要延后首屏核心内容,并要处理占位尺寸、预加载、滚动体验和可访问性。
Prompt 优化有哪些常见方法?
Prompt 优化的核心是降低任务歧义、补齐上下文、明确输出约束,并建立可评估的迭代过程。常见方法包括明确目标和受众、给出背景材料、拆解任务步骤、规定输出格式、提供正反例、使用分隔符、约束边界条件、要求模型列出假设和不确定性,以及通过测试集持续比较效果。
Temperature 和 Top-K 有什么区别?
Temperature 和 Top-K 都控制大语言模型采样随机性,但作用层不同。Temperature 会整体调整候选 token 的概率分布,低温让高概率 token 更突出,高温让分布更平;Top-K 会先限制候选集合,只允许从概率最高的 K 个 token 中采样。前者改变概率形状,后者裁剪候选范围。
AI 无法处理复杂业务逻辑时如何做人工干预?
当 AI 无法稳定处理复杂业务逻辑时,人工干预不是简单地让人兜底,而是把系统设计成可识别不确定性、可暂停高风险动作、可交给合适人员决策、可追踪结果并反哺模型的闭环。核心是明确哪些场景自动化、哪些场景必须升级、人工结果如何沉淀成规则、样本和评测。
HTTPS 握手和加密过程是什么?
HTTPS 的本质是 HTTP 运行在 TLS 安全通道之上。握手阶段通过证书验证服务器身份,通过密钥交换协商会话密钥;数据传输阶段主要使用对称加密保护内容,同时用完整性校验和认证机制防止篡改与伪造。
Cookie 有哪些常见属性?
Cookie 常见属性包括 Name、Value、Domain、Path、Expires、Max-Age、Secure、HttpOnly、SameSite、Priority、Partitioned 等。它们共同决定 Cookie 的内容、有效期、发送范围、安全边界和跨站行为,是登录态、个性化和安全防护中的基础机制。
AI 返回 ECharts 图表配置时如果出错,前端应如何做校验、降级、重试、可观测性和用户提示?
这题考前端工程师能否把 AI 生成 ECharts 配置当成不可信输入处理,并设计校验、降级、重试、观测和测试闭环,保证图表功能稳定可用。