面试题集前端工程师岗位面试题.docxVIP

第PAGE页共NUMPAGES页

2026年面试题集：前端工程师岗位面试题

一、基础知识（5题，每题2分，共10分）

1.题目：简述HTTP和HTTPS的区别，以及HTTPS的工作原理。

答案：HTTP是超文本传输协议，明文传输数据，易被窃取；HTTPS是HTTP的安全版本，通过SSL/TLS协议加密数据传输，工作原理包括证书验证、密钥交换、加密通信三个阶段。

2.题目：解释浏览器渲染过程（解析HTML、CSS、JavaScript的顺序）。

答案：浏览器按顺序解析HTML构建DOM树，解析CSS构建CSSOM树，合并成渲染树，再执行JavaScript脚本，最终绘制页面。

3.题目：说明事件冒泡和事件委托的区别及适用场景。

答案：事件冒泡是事件从子元素向上传递，事件委托是利用事件冒泡原理，在父元素上监听事件，减少事件绑定。适用场景：动态元素和大量元素的事件处理。

4.题目：描述CSS选择器的优先级规则（内联ID类标签伪类）。

答案：优先级计算公式：`继承权重行内样式ID选择器类选择器属性选择器标签选择器伪类选择器`。

5.题目：解释什么是CSS盒模型，及其与`box-sizing`的区别。

答案：盒模型包括内容、内边距、边框、外边距。`box-sizing:border-box`时，边框和内边距包含在宽高中，`content-box`则不包含。

二、JavaScript（8题，每题3分，共24分）

1.题目：说明`let`和`const`的区别。

答案：`let`支持块级作用域，可重新赋值；`const`定义常量，不可重新赋值，但属性可修改（对象）。

2.题目：解释Promise的三个状态（Pending、Fulfilled、Rejected）及`.then()`的链式调用原理。

答案：Promise状态不可变，`.then()`返回新Promise，实现异步链式调用。

3.题目：简述闭包的原理及用途。

答案：闭包是函数及其词法环境的组合，允许函数访问外部作用域变量，用于数据封装和延时执行。

4.题目：说明`async/await`的原理及其与Promise的关联。

答案：`async/await`基于Promise，`async`函数返回Promise，`await`暂停执行等待Promise完成。

5.题目：解释原型链和继承的两种实现方式（原型式、寄生式）。

答案：原型链通过`__proto__`连接，寄生式通过构造函数返回新对象实现继承。

6.题目：描述事件循环（EventLoop）的工作机制。

答案：主线程执行同步代码，异步任务进入任务队列，事件循环按顺序执行。

7.题目：说明`this`的绑定规则（严格模式、默认绑定、隐式绑定、显式绑定）。

答案：严格模式下`this`为`undefined`，默认绑定看函数调用方式，隐式绑定看上下文，显式绑定用`call/apply`。

8.题目：解释函数柯里化（Currying）的原理及实现。

答案：柯里化将多参数函数转换为单参数函数，逐步执行。实现示例：`functionadd(a){returnfunction(b){returna+b;};}`。

三、框架与库（7题，每题4分，共28分）

1.题目：比较React和Vue的虚拟DOM差异（性能、生命周期）。

答案：React使用`React.createElement`创建，Vue基于`Object.defineProperty`，Vue响应式更快，React组件更灵活。

2.题目：解释Vue3的CompositionAPI（`ref`、`reactive`）与Vue2的OptionsAPI的区别。

答案：CompositionAPI支持逻辑抽离，`ref`是响应式引用，`reactive`是响应式对象，更灵活。

3.题目：说明React中的`useEffect`的依赖项不传与全部传的区别。

答案：不传时每次渲染都执行，传依赖时仅依赖变化时执行，避免不必要的重复渲染。

4.题目：解释Angular的生命周期钩子（`ngOnInit`、`ngOnChanges`）。

答案：`ngOnInit`组件初始化时调用，`ngOnChanges`输入属性变化时调用，用于数据绑定。

5.题目：描述Svelte的编译时优化（虚拟DOM概念缺失）。

答案：Svelte在编译时将组件转为原生命令，无需虚拟DOM，性能更优。

6.题目：说明TypeScript中的泛型与接口的结合使用。

答案：泛型允许类型参数化，接口可定义泛型属性，如`interfaceListT{items:T[]}`。

7.题目：解释Web