中智前端面试题及详细答案（真实面试版）.docxVIP

中智前端面试题及详细答案（真实面试版）

这套面试题贴合中智前端真实面试侧重点，涵盖CSS、JavaScript、Vue核心、工程化、场景实操、性能优化六大高频模块，答案摒弃套话，以开发实战视角作答，适配校招、社招初中级前端岗位。

一、CSS基础高频题

1、CSS选择器优先级规则是什么？如何计算？

常规优先级从高到低排序：!important＞行内样式＞ID选择器＞类/伪类/属性选择器＞标签选择器＞通配符、继承样式。

行业通用权重计算方式，采用四元组（a,b,c,d）对比，权重高的样式优先生效：

a：行内样式数量，有则为1、无则为0

b：ID选择器个数

c：类、伪类、属性选择器个数

d：标签、伪元素选择器个数

对比规则：从左到右依次比较，数值大的优先级更高；权重相同时，后写的样式覆盖先写的。日常开发尽量不使用!important，会破坏样式层级，难以维护。

2、说一说重排和重绘的区别，以及如何优化

重绘：元素的外观样式改变（颜色、透明度、背景色），但布局尺寸、位置不变，浏览器仅重新绘制像素，开销较小。

重排（回流）：元素的布局、宽高、位置发生变化，会触发浏览器重新计算页面所有元素的几何布局，开销极大，一个元素重排可能引发父级、子级、同级元素连锁重排。

优化方案：

批量修改样式：统一修改class类名，避免逐行修改style样式

离线操作DOM：使用文档碎片