5.26 编程猫二面 进终面

1.前端工程化项目构建工具：使用自动化构建（Webpack, Vite）来处理和打包前端资源（JavaScript, CSS, 图片），从而简化开发流程，提升开发体验。这些工具通常支持模块化开发、代码压缩、混淆、热更新等功能。模块化开发：采用模块化的开发模式（如 ES6 模块、CommonJS、AMD 等），可以将代码拆分为更小、更易于管理的部分，有助于团队协作和代码复用。每个模块负责单一功能，并且通过明确的接口与其他模块交互。组件化开发：基于组件的思想构建用户界面，比如 React、Vue中的组件。组件是独立且可复用的 UI 构建块，它们封装了自身的逻辑和样式，可以在不同的页面或应用之间共享...

## 时长 70 分钟 北京合思招聘系统### 1.自我介绍环节### 2.做题环节（20 分钟左右）有 22 道选择（html,css,js,数据结构),一道算法题：字符串去重，我和面试官简单说了一下思路（new Set),然后他让我随便写一点交卷了### 3.项目，场景和八股环节（这个环节持续太长了，有些我实在是忘了）1.你是如何做到首屏优化的2.讲讲 CI/CD 是如何实现的3.项目中有使用过 webpack 和 vite 吗4.webpack 和 vite 有什么区别5.有没有使用过什么状态管理工具6.项目使用了什么缓存机制这里我展开讲讲。关于缓存数据，蜀黍使用了缓存头(Cache-Control)和 localStorge。项目中使用了 Promise.all 来进行并发请求，同时从服务器和本地缓存请求数据7.怎么获取的缓存数据localStorge，状态码 3048.缓存的过期时间9.NextJS 中如何设置代码在客户端运行10.NextJS 如何设置服务端运行（好像是这个问法)11.useEffect 中如何进行数据请求（丝滑切换至场景题）12.如果不同 useEffect 中相互依赖过多怎么办（反问面试官，竟然是退化至使用类式组件）13.如果我想让我的 useRef 使用外部的 props 应该怎么办（forwardRef）14.当我的父组件将一个可能会经常变化的 props 传递给子组件时，应该怎么办（useMemo）15.我想全局管理 props,并且防止出现 props drill 的问题，应该怎么办（useContext）16.我想使用 useRef 来实现一个可以返回窗口顶部的功能，应该怎么实现，使用哪些 API17.我想将一个二维数组转换为一维数组怎么办18.如果我的二维数组中不完全都是数组怎么办（instanceof、Array.isArray）19.实现 add(1)(2) === 3 （函数柯里化）20.如何实现 string 和 number 之间的相互转换21.如何改变 this 的指向22.你有没有用过什么 ES6 的新特性23.Promise 打印顺序```javascriptconst promise = new Promise((resolve, reject) => {  console.log(1)  resolve()  console.log(2)})promise.then(() => {  console.log(3)})console.log(4)```24.有没有使用过 typeof25.flex 布局中如何实现水平垂直居中26.如何消除 float 带来的影响27.给定一个完整的 URL，如何获取其查询参数28.React 19 和 React 18 有什么区别29.项目中是否有采用什么对静态资源的优化可能还有，但是暂时想不起来了## 时长 15 分钟 洋葱学园1.对于一个列表，我们通常会给其添加一个 key,可以不添加吗，如果不添加是否有什么问题？2.对于一个 H5 页面加载过慢，如何优化3.将 URL 输入搜索栏，浏览器会做什么4.如何实现进入视窗才进行懒加载5.如何在一个 JS 文件中白屏时返回 Loading 组件（我直接说了 React 和 NextJS 中如何实现哈哈）6.移动端适配7.如何处理重复的请求（本人说了 axios cancelToken、防抖和节流解决这个问题）我确实记得应该还有，但是想不起来（

1. 用 Vue 或 React 写一个倒计时组件解题思路：倒计时本质上是一个定时器（setInterval 或 requestAnimationFrame），在组件挂载时启动，定时更新当前剩余时间，倒计时结束后清理定时器。Vue 示例（Composition API）<template> <div>{{ time }}</div></template><script setup lang="ts">import { ref, onMounted, onUnmounted } from 'vue'const dur...

时长45分钟 欢聚集团1.什么是盒子模型2.日常开发中使用过什么选择器3.伪元素和伪类的区别（css 问题到此为止）4.讲讲什么是闭包，闭包有什么优点，会出现什么问题5.讲讲 this 的指向问题6.讲讲原型和原型链7.原型链有什么用8.讲讲类型断言和类型解释（typeof,instanceof）的区别9.我看你使用过 typescript,讲讲你为什么使用 typescript10.讲讲你对 js 和 ts 的区别的理解11.讲讲你对明明使用静态语言却还用 any 的看法12.你在代码中会用 any 吗（我说一般会定义 interface)13.讲讲定义 interface 和 any 之间的区别（js/ts 的问题应该是到此为止，可能还有但不记得了）14.讲讲你对 hooks,函数式组件，类式组件的区别（本人从生命周期的角度回答）15.你认为 hooks 有什么缺点（本人说只能在外部使用，在 if 和 while 不可使用，可能不是很灵活）16.你知道为什么 hooks 不能在外部使用吗？17.如果我有在 if 和 while 中使用 hooks 有什么解决方案吗（人麻了）18.如果是你，你会根据什么角度来选择使用 useEffect 和 useLayoutEffect19.讲讲你对 useContext 的理解20.useContext、zustand 和 Redux 的区别因为腾讯会议时长只约了 30 分钟，到这里应该 30 分钟了，可能还有一些问题但是我忘了（悲）你的项目中有什么亮点吗，可以和我说一下（现场看我简历，于是延长了 15 分钟。。。）21.讲讲你项目中的一些功能22.我看你会做一些性能优化，你是怎么实现的呢23.你为什么会想着去优化压缩项目体积呢24.你说你使用了 http/2,为什么 http/2 能比 http/1.1 更加节省资源呢25.怎么看到资源更加节省了呢26.你对虚拟列表的原理有了解吗27.你的项目中是一开始就使用了 vite 吗28.为什么会想着做一个中间件呢29.你提到你了解 NodeJS,有使用过吗30.讲讲 useCallback,useMemo31.具体讲讲 useMemo反问环节45 分钟全是八股，人麻了时长 45 分钟 中科紫东太初1.我对你的第一个项目比较感兴趣，有在线网址吗2.你的动画挺好看，使用了哪些库3.讲讲中间件的功能4.查询准确率只有 85%，可是对于后端这样需要准确率较高的场景会不会有什么问题5.是怎么记录首屏加载时间的6.你是怎么实现 CI/CD 的手撕题：React todolist 面试官人很温柔，基本一直在提醒，看我在思考，还写了一段代码给我看（感动）## 总结一天两场面试，累倒也没有，还是有得到锻炼发现了自己的不足