#大家都开始春招面试了吗# 1. 传统的 CSS 文件（全局样式）传统的 CSS 方案通常是将所有的样式放在一个或多个 CSS 文件中，通过  标签引入。在小型项目或单页面应用中，简单直接。使用场景：- 小型项目- 快速开发和原型设计- 个人项目优点：- 结构简单，易于理解。- 实现快速，适合小项目。缺点：- 不利于维护：当项目增大时，CSS 可能变得冗长且重复。- 样式冲突：没有隔离，容易出现不同组件间的样式污染。2. CSS 预处理器（如 Sass / LESS / Stylus）CSS 预处理器通过扩展 CSS，提供了变量、嵌套规则、混合宏（mixin）等功能，提升了样式的复用性和可维护性。使用场景：- 中型项目- 需要模块化和可扩展性的项目- 需要多次复用样式的项目优点：- 支持变量、嵌套、函数等增强功能，提高代码可维护性。- 提高代码的模块化与复用性。- 代码组织更加清晰，能避免重复的 CSS 代码。缺点：- 编译过程：需要将 Sass 或 LESS 编译成 CSS。- 学习曲线相对较陡（尤其对于初学者）。示例（Sass）：// _variables.scss$primary-color: #3498db;$font-size: 16px;// _layout.scss.container {  width: 80%;  margin: 0 auto;}// main.scss@import 'variables';@import 'layout';body {  font-size: $font-size;}.header {  background-color: $primary-color;}3. BEM（块元素修饰符）命名法BEM 是一种 CSS 类命名方法论，适用于大型项目，帮助前端开发者更好地组织和管理样式。BEM 将样式拆分成更小的、功能化的组件，通过定义明确的命名规范来减少样式冲突和提高代码的可维护性。使用场景：- 大型项目，尤其是前端与后端分离时- 团队协作项目- 需要高度模块化和可复用的项目优点：- 命名规范清晰，避免命名冲突。- 样式组件化，提升可复用性。- 便于多人协作开发。缺点：- 代码量相对较多，类名冗长。- 初学者学习曲线较陡。示例：/* BEM 风格 */.button {  padding: 10px;  background-color: blue;}.button--primary {  background-color: #3498db;}.button__icon {  margin-right: 5px;}4. CSS-in-JSCSS-in-JS 是将 CSS 写在 JavaScript 代码中的一种方法，通常与 React 等框架一起使用。它将 CSS 作为 JavaScript 对象来定义，样式和组件逻辑耦合在一起，从而实现样式的动态计算和管理。使用场景：- React、Vue 等组件化框架项目- 需要根据组件状态动态修改样式- 小型项目或者需要样式和组件解耦的大型项目优点：- 样式与组件逻辑结合，易于管理和维护。- 动态生成样式，支持主题切换、响应式设计等功能。- 减少全局样式冲突，样式范围仅限于组件内部。缺点：- 对性能有一定影响（样式计算和注入）。- 需要配置或使用框架（如 styled-components、emotion）。示例（styled-components）：// React + styled-components 示例import styled from 'styled-components';const Button = styled.button`  padding: 10px;  background-color: ${props => props.primary ? '#3498db' : '#ccc'};  color: white;  border: none;`;const App = () => (      Primary Button    Secondary Button  );5. CSS 模块化（CSS Modules）CSS 模块化方案允许将 CSS 写在独立的文件中，并且通过自动生成的唯一类名避免样式冲突。它通常与 Webpack 一起使用，支持作用域限定的 CSS。使用场景：- 现代前端开发，尤其是使用 Webpack 或 React/Vue 等框架时。- 需要避免全局样式污染的项目。优点：- 避免了全局命名空间污染。- 类名自动生成，保证唯一性和作用域隔离。- 支持组件化，提升可维护性。缺点：- 需要额外的配置和工具（如 Webpack loader）。- 类名经过编译后可能较长。示例（React + CSS Modules）：// App.module.css.button {  padding: 10px;  background-color: #3498db;  color: white;}// App.jsximport React from 'react';import styles from './App.module.css';const App = () => (  Click Me);6. Tailwind CSS（原子化 CSS）Tailwind CSS 是一种实用工具优先（utility-first）CSS 框架，提供了大量的原子类（单一功能的 CSS 类），可以快速构建复杂的布局。使用场景：- 快速开发和原型设计- 喜欢“原子类”方式的开发者- 开发团队需要减少自定义样式的项目优点：- 提供了高度复用的类，减少了自定义 CSS 的需求。- 代码量少，开发速度快。- 通过配置定制化 Tailwind，适应项目需求。缺点：- 类名会非常多，容易使 HTML 代码显得冗长。- 学习成本较高，特别是对于不熟悉原子类概念的开发者。示例：      Click Me  7. Atomic CSS（原子化 CSS）原子化 CSS 和 Tailwind 类似，旨在通过提供小的、独立的 CSS 类来构建样式。每个类只做一件事，组合起来形成完整的样式。使用场景：- 大型项目，尤其是需要高效的布局和样式调整时。- 需要减少样式重复的项目。优点：- 高效的代码复用。- 提高样式的可维护性。- 可以轻松地修改布局和样式，而无需修改整个 CSS。缺点：- 类名较长，HTML 中的样式代码显得冗长。- 学习曲线较高。---用的多的CSS技术Flex典型用途：- 创建水平和垂直居中的布局- 实现响应式设计- 动态调整容器内部元素的排列媒体查询媒体查询是响应式设计的核心工具之一，它使得在不同设备上展示不同样式成为可能。常见用法是根据屏幕尺寸来调整布局。典型用途：- 响应式设计- 根据屏幕宽度调整页面布局或字体大小- 控制不同设备上的显示效果Position（定位）定位是 CSS 中的一个基本概念，通过 position 属性可以控制元素的定位方式。常见的有 static, relative, absolute, fixed 和 sticky 等。典型用途：- 创建浮动元素- 固定元素（如固定导航栏）- 在容器内相对定位元素Transitions（过渡效果）CSS 过渡效果可以让你在元素的属性发生变化时添加平滑的过渡效果，常用于按钮、图片、导航栏等的交互效果。典型用途：- 鼠标悬停时的平滑动画效果- 改变背景色、宽度、透明度等属性时的平滑过渡伪类和伪元素用于在不添加额外 HTML 元素的情况下，对元素的特定状态或部分应用样式。典型用途：- :hover, :focus, :active 等交互状态- ::before, ::after 等用于生成内容和装饰Overflow（溢出处理）overflow 属性用于处理内容溢出的情况，常见用途是创建可滚动的区域或隐藏溢出内容。典型用途：- 创建带滚动条的容器- 隐藏溢出内容

请问各位大佬，之前写过一个小程序的项目，部分功能是和后端对完了的，但是现在项目搁置了，很多东西后端没写前端也没往前推，这种项目还要写在简历上吗？

有的同学在问要不要学vue2，我感觉学技术应用的时候，直接学vue3，背原理八股文的时候再背vue2，就跟React的类组件一样，我根本不想学也不想用，但是有些面试还喜欢问生命周期，，但是我保证 某几个大厂你进去实习包是需要维护那个vue2史山 甚至是vue2.5用不了v-slot版然后 这其实是一个八股 vue3比vue2好在哪一、响应式系统革新Vue2 基于 Object.defineProperty 的响应式存在硬伤：无法监听动态新增属性、数组索引修改需特殊处理。Vue3 采用 Proxy 重构后：自动追踪深层嵌套对象变化数组操作无需特殊 API（如 push直接生效）内存占用显著降低（官方测试减少约 40%）渲染性能优化（复杂场景实测提升 1.5-2 倍）二、组合式 API 颠覆逻辑组织方式对比 Vue2 的选项式 API，组合式 API 实现逻辑关注点聚合高复用性：业务逻辑可封装为独立函数跨组件复用TS 友好：天然支持类型推导，复杂项目维护性提升逻辑解耦：同一功能相关代码集中管理（如数据+请求+状态）心智负担降低：解决this 上下文问题，函数作用域更清晰三、工程化能力全面升级Tree-shaking 优化：打包体积减少 40%+（仅引入使用到的功能）模块化设计：核心库拆分为独立模块（如响应式/编译器分离）兼容性策略：提供渐进式迁移方案，支持与 Vue2 混用生态协同：Vite 构建工具等新库四、新特性解决历史痛点多根组件模板：摆脱外层冗余  包裹Teleport 组件：优雅处理全局弹窗/Toast 等 DOM 层级问题自定义渲染器：突破 Web 限制，可开发小程序/Canvas 应用Fragment 支持：服务端渲染 (SSR) 性能显著优化五、长期维护与生态趋势官方维护策略：Vue2 已于 2023 年底停止维护社区资源倾斜：全家桶已全面适配 V3TypeScript 深度整合：类型提示覆盖模板/Props/自定义Hook未来演进基础：新功能（如 Suspense/新的 DevTools）仅支持 V3