小米前端实习面经

- - 公司用vue31.css语法及其新特性2.项目中有用哪些css选择器？3.css选择器优先级4.css中实现渐变背景有哪个属性，怎么写？5.css动画，animation和transition的区别？6.自定义上下不定跳动的动画怎么实现？7.css鼠标悬停提示，怎么实现？8.用过less或sass吗9.怎么在项目中引用并使用less的？10.less里面定义了变量如何在css里使用？11.用过less里面的函数吗12.es6语法有哪些新特性？13.var let const区别？14.怎么通过原型链方法判断变量是不是一个数组？15.typeof和instanceof区别？16.什么是作用域？(答错了，答成作用域链了)17.箭头函数和普通函数的区别？18.数据解构用在哪些方面？19.数据解构的优点和缺点？20.js异步方案有几种？21.在promise.reject().then()里面再返回一个promise，结果可以从哪里获取到？22.项目中用了哪些vue的方法或API？23.vue3不用setup()怎么去写组件？24.父组件有钩子函数，子组件也有钩子函数，它们执行顺序是怎样的？25.vue3里，若父组件里面有异步组件，它们的生命周期函数执行顺序是怎样的？26.computed和watch的区别？27.vue3组件之间的数据传递怎么实现？(组件通信)28.用到了pinia哪些方法或语法糖？29.pinia中定义action，怎么在组件中使用action？30.路由配置在后端时，怎么动态加载到页面上？31.vue-router哪个方法 动态追加到路由上？32.路由传参有几种方式？33.封装过哪些组件？34.做过哪些Webpack打包优化，配置，插件？35.还了解过哪些打包工具？36.git用ui界面还是命令？37.git常用命令？38.git fetch和pull区别？39.本地新建一个分支，推送到远程仓库，用什么命令？40.用过哪些node.js相关的东西？41.了解过node.js框架？

美团内推啦~ 投递链接： https://zhaopin.meituan.com/m/campus?staffSsoId=20507416 在美团待了挺久了，感觉 美团值得拥有，祝大家一切顺利嗷～ 美团，让你的创意闪耀舞台！我们鼓励员工提出新想法，实现个人和公司的双赢！  以下是面经分享： 第一轮技术面  自我介绍 强缓存与协商缓存机制实现原理 HTTP/1、HTTP/2、HTTP/3的核心区别 Set与WeakSet的区别及弱引用特性 闭包与V8垃圾回收机制 React Hooks的设计动机及函数组件与类组件的差异 React Fiber架构解决的问题及实现思路 手写发布订阅模式 实现Pro...

1. display: none 和 visibility: hidden 的区别• 渲染层面：◦ display: none：元素完全从渲染树移除，不占据空间（回流+重绘）。◦ visibility: hidden：元素仍在渲染树中，占据空间但不可见（仅重绘）。• 子元素影响：◦ display: none：子元素也会被隐藏。◦ visibility: hidden：子元素可通过 visibility: visible 单独显示。2. 三列布局（两边固定，中间自适应）方案1：Flex 布局.container { display: flex; }.left, .right { width: 200px; }.center { flex: 1; }方案2：Calc 计算.center { width: calc(100% - 400px); margin: 0 200px; }方案3：绝对定位 + margin.container { position: relative; }.left, .right { position: absolute; width: 200px; }.center { margin: 0 200px; }3. 闭包• 定义：函数内部引用外部作用域变量，且变量在外部作用域释放后仍被保留。• 作用：实现私有变量、函数防抖/节流等。• 注意：过度使用可能导致内存泄漏。4. React 状态管理方案及区别方案 特点** useState** 组件级状态，适合简单逻辑。** useContext** 跨组件状态，适合全局轻量级状态（避免逐层传递 props）。** Zustand** 轻量级全局状态管理，基于 Context + immer，支持订阅和模块化。** Redux** 复杂全局状态管理，需手动配置 reducer、action 等，适合大型应用。5. 虚拟列表实现• 核心原理：仅渲染可见区域内的列表项，通过滚动事件动态计算并更新显示内容。• 关键步骤：1. 计算可见区域起始索引和结束索引。2. 渲染对应索引的列表项。3. 通过 transform 或 padding 模拟滚动位置，保持滚动条正常显示。6. React 性能优化• 组件优化：◦ 使用 React.memo 缓存函数组件，避免无必要重渲染。◦ useCallback 缓存回调函数，避免子组件因引用变化重渲染。• 状态优化：◦ 避免在 useState 中存储不必要的状态（如临时计算值）。◦ 使用 useReducer 处理复杂状态逻辑，减少重复更新。• 其他：◦ 虚拟列表/表格（长列表优化）。◦ 懒加载（React.lazy + Suspense）。◦ 避免内联函数在渲染中重复创建。7. React 的状态（补充常见问题）• 状态更新异步性：◦ 合成事件和生命周期中，setState 异步更新，需通过回调获取最新值。◦ 原生事件（如 setTimeout）中，setState 同步更新。• 状态穿透问题：◦ 多层组件传递状态时，可用 useContext 或状态管理库简化。8. 代码题：生成有效括号组合（回溯法）var generateParenthesis = (n) => {const res = [];const backtrack = (path, left, right) => {if (path.length === 2 * n) res.push(path);if (left < n) backtrack(path + '(', left + 1, right);if (right < left) backtrack(path + ')', left, right + 1);};backtrack('', 0, 0);return res;};思路：通过回溯法枚举所有可能，用 left 和 right 控制左右括号数量，确保任意时刻 right ≤ left 且总数不超过 n。

1.手撕版本号排序 // 版本号排序 function compareV(a,b){ const Sorta = a.split('.').map(Number); const Sortb = b.split('.').map(Number); const maxLength = a.length > b.length ? a.length : b.length; for(let i=0;i<maxLength;i++){ const numA = a[i] || 0; const numB = b[i] || 0; if(numA < numB) return -1; if...