“前端面试造火箭”其实11月的前端大部分都是先混进去再说...

61 阅读12分钟

每一个在找工作的前端基本都经历过,从V8引擎的垃圾回收机制问到微前端架构的实现原理,从手写一个Promise Polyfill再到用CSS画一个旋转的立方体。从八股原理到场景题面试,最后手撕代码,面试难度越来越高的情况下,竞争者也越来越多,内卷更是成为一个很日常的词汇

这种现象的背后,是行业的“内卷”与筛选成本的上升。公司希望用最高效的方式,从海量简历中找出那个“即插即用”、潜力无限的人才。于是,面试题目的深度和广度被不断拔高,形成了看似高不可攀的门槛。

但,面试中的高要求,与面试通过后的日常,往往是一个鲜明的对比,这就是在提醒你,要学会找对方法,而不是随波逐流,盲目恐慌

那么,如何“混”进去?关键在于:

  1. 基础与框架:  无论面试问得多花哨,JavaScript 基础(作用域、闭包、原型链、事件循环)、CSS 布局能力、HTTP 协议等永远是一成不变。同时,熟练掌握一到两个主流框架(React/Vue)及其生态,是你能够立刻上手干活的关键。
  2. 深度与广度的平衡:  你不需要对所有领域都了如指掌,但需要在1-2个方向上展现出你的深度。比如,你可以深入研究 Vue 3 的响应式原理和编译优化,或者对 React Hooks 的设计理念和最佳实践有独到见解。这能成为你区别于其他人的闪光点。
  3. 工程化与解决方案思维:  面试官问“造火箭”的问题,很多时候不是在考你记忆,而是在考察你的思路和解决问题的能力。当被问到庞大、陌生的问题时,不要慌张,尝试拆解它,说出你的思考逻辑,从项目部署、性能优化、团队协作等工程化角度去阐述,这比直接给出一个标准答案更重要。
  4. “混”是一种智慧:  这里的“混”,不是指欺骗,而是指一种务实的策略——精准地准备,聪明地展示。了解目标公司的技术栈,针对性地复习;在面试中,引导话题到你擅长的领域;对于不懂的问题,坦诚承认并表达出强烈的学习意愿。

所以,别焦虑,先把门票拿到手,未来的精彩,从此刻开场—

JavaScript 面试题

相比于npm和yarn,pnpm的优势是什么?
如果使用Math.random()计算中奖概率会有什么问题吗?
怎么使用js 实现拖拽功能?
举例说明你对尾递归的理解,以及有哪些应用场景
说说你对 lterator, Generator 和 Async/Await 的理解
说说你对模块化方案的理解,比如CommonJS、AMD、CMD、ESModule分别是什么?
前端跨页面通信,你知道哪些方法?
Javascript脚本延迟加载的方式有哪些?
怎么理解ES6中 Generator的?使用场景有哪些?
导致页面加载白屏时间长的原因有哪些,怎么进行优化?
【Promise第38题】下面代码的输出是什么?
【Promise第40题】下面代码的输出是什么?
微前端中的应用隔离是什么,一般是怎么实现的?
JavaScript 对象的底层数据结构是什么?
浏览器和 Node 中的事件循环有什么区别?
版本号排序
哪些原因会导致js里this指向混乱?
怎么实现大型文件上传?
说说你的ES6-ES12的了解

React.js 面试题

fiber架构的工作原理?
React Reconciler 为何要采用 fiber 架构?
useState是如何实现的?
React Fiber是什么?
简单介绍下React中的 diff 算法
如何让 useEffect 支持 async/await?
React 中怎么实现状态自动保存(KeepAlive)?
React Fiber 是如何实现更新过程可控?
react中懒加载的实现原理是什么?
React有哪些性能优化的方法?
不同版本的 React 都做过哪些优化?
React18新特性
说说你对 React Hook的闭包陷阱的理解有哪些解决方案?
React 中,怎么给 children 添加额外的属性?
Fiber 为什么是 React 性能的一个飞跃?
react是否支持给标签设置自定义的属性,比如给video标签设置webkit-playsinline?

Vue.js 面试题

Vue 模板是如何编译的
vue3 相比较于 vue2,在编译阶段有哪些改进?
说说Vue 页面渲染流程
Vue 项目中,你做过哪些性能优化?
如果使用Vue3.0实现一个 Modal,你会怎么进行设计?
Vue3.0里为什么要用 Proxy API替代defineProperty APl ?
Vue 有了数据响应式,为何还要 diff ?
说说 vue3 中的响应式设计原理
说说 Vue 中 css scoped 的原理
vue3 的响应式库是独立出来的,如果单独使用是什么样的效果?
手写 vue 的双向绑定
什么是虚拟DOM?如何实现一个虚拟DOM?说说你的思路
SSR是什么?Vue中怎么实现?
说下Vite的原理

Node.js 面试题

浏览器和 Node 中的事件循环有什么区别?
如何实现jwt鉴权机制?说说你的思路
怎么进行 Node 服务的内存优化?
为什么Node在使用es module时必须加上文件扩展名?
说说Node中的EventEmitter?如何实现一—个EventEmitter?
说说Node文件查找的优先级以及Require方法的文件查找策略?
两个 Node.js 进程如何通信?
pm2守护进程的原理是什么?
单线程的 nodejs 是如何充分利用计算机CPU 资源的呢?
body-parser 这个中间件是做什么用的?
说说对中间件概念的理解,如何封装 node中间件?
说说对Nodeis中的事件循环机制理解?

Typescript 面试题

如何检查Typescript中的null和undefined
什么是TypeScript Declare关键字?
Typescript 中的 getter/setter 是什么?你如何使用它们?
unknown 是什么类型?
never 是什么类型,详细讲一下
如何在TypeScript中实现继承?
说-说Typescript中的类及其特性。
请实现下面的 sleep 方法
Typescript中的方法重写是什么?
typescript 中的 is 关键字有什么用?
什么是Typescript映射文件?
Typescript中的类型有哪些?
Typescript中interface 和 type 的差别是什么?

编程题 面试题

实现深拷贝
请手写“堆排序”
虚拟 dom 原理是什么,手写一个简单的虚拟 dom 实现
请在不使用 setTimeout 的前提下,实现setinterval
实现JSONP
实现一个类,其实例可以链式调用,它有一个sleep 方法,可以sleep一段时间后再...
编写一个vue组件,组件内部使用插槽接收部内容,v-model双向绑定,实现折叠...
版本号排序
Promise 的 finally 怎么实现的?
实现 Promise
字符串解析问题
实现mergePromise函数

工程化 面试题

webpack 中module、chunk、bundle 的区别是什么?
说说你对前端工程化的理解
webpack loader 和 plugin 实现原理
为什么 webpack 可以通过文件打包,让浏览器可以支持 CommonJs 规范?
webpack tree-shaking 在什么情况下会失效?
微前端中的路由加载流程是怎么样的?
说下Vite的原理
说说你对 source Map 的了解
说说webpack的构建流程?
ES6 代码转成 ES5 代码的实现思路是什么?
webpack的module、bundle、chunk分别指的是什么?
webpack treeshaking机制的原理是什么?
为什么 SPA 应用都会提供一个 hash 路由好处是什么?

场景题

71.小程序为什么会有两个线程【腾讯一面】

72.web应用中如何对静态资源加载失败的场景做降级处理

73.html中前缀为data-开头的元素厘性是什么?

74.移动端如何实现上拉加载,下拉刷新?【字节一面】

75.如何判断dom元素是否在可视区域【字节一面】

76.前端如何用canvas来做电影院选票功能【美团一面】

77.如何通过设置失效时间清除本地存储的数据?【腾讯二面】

78.如果不使用脚手架,如果用webpack构建一个自己的react应用

79.用nodejs实现一个命令行工具,统计输入目录下面指定代码的行数

80.packagejson里面sideEffects厘性的作用是啥【必会】

81.script标签上有那些厘性,分别作用是啥?【必会】

82.为什么SPA应用都会提供一个hash路由,好处是什么?

83.[React]如何进行路由变化监听【字节一面】

84.单点登录是是什么,具体流程是什么【腾讯一面】

85.web网页如何禁止别人移除水印【百度一面】

86.用户访问页面白屏了,原因是啥,如何排查?

87.[代码实现]s中如何实现大对象深度对比

88.如何理解数据驱动视图,有哪些核心要素?【腾讯二面】

89.vue-cli都做了哪些事儿,有哪些功能?

90.JS执行100万个任务,如何保证浏览器不卡顿?【百度一面】

91.JS放在head里和放在body里有什么区别?

92.Eslint代码检查的过程是啥?【必会】

93.虚拟混动加载原理是什么,用IS代码简单实现一个虚拟滚动加加载

94.[{React]react-router和原生路由区别

95.html的行内元素和块级元素的区别【京东一面】

96.介绍-下requestlIdleCallback api

97.documentFragment api是什么,有哪些使用场景?【必会】

98. git pull和 git fetch 有啥区别?

99.前端如何做页面主题色切换【腾讯一面】

100.前端视角-如何保证系统稳定性【字节一面]

101.如何统计长任务时间、长任务执行次数【腾讯二面】

102.V8里面的JT是什么?【京东一面]

103.用Js写一个cookies解析函数,输出结果为一个对象

104.vue中Scoped Styles是如何实现样式隔离的,原理是啥

105.样式阿商方式有哪些【字节一面】

106.在JS中,如何解决递归导致栈溢出问题?

107.站点如何防止爬虫?【百度一面】

108.ts项目中,如何使用nodemodules里面定义的全局类型包到自己项目src下面使用?【百度二面】

109.不同标签页或窗口间的【主动推送消息机制】的方式有哪些?(不借助服务端)

110.【React】在react项目开发过程中,是否可以不用reactrouter使用浏览器原生history路由来组织页面路由?

111.在表单校验场景中,如何实现页面视口滚动到报错的位置

112,如何一次性渲染十万条数据还能保证页面不卡顿【百度二面】

113.【webpack】打包时hash码是如何生成的【必会】

114.如何从0到1搭建前端基建【京东一面】

115.你在开发过程中,使用过哪些TS的特性或者能力?【美团一面】

116.JS的加载会阻塞浏览器渲染吗?【百度一面】

118.Webpack项目中通过script标签引入资源,在项目中如何处理?

119.应用上线后,怎么通知用户刷新当前页面?【腾讯一面】

120.Eslint代码检查的过程是啥?

121.HTIP是一个无状态的协议,那么Web应用要怎么保持用户的登录态呢?

122.如何检测网页空闲状态(一定时间内无操作)【百度二面】

123.为什么Vite速度比Webpack 快?

124.列表分页,快速翻页下的竟态问题【百度二面】

125.JS执行100万个任务,如何保证浏览器不卡顿?

126.git仓库迁移应该怎么操作

127.如何禁止别人调试自己的前端页面代码?【字节二面】

128.web系统里面,如何对图片进行优化?【必会】

129.0Auth2.0是什么登录方式

130.单点登录是如何实现的?

131.常见的登录鉴权方式有哪些?

132.需要在跨域请求中携带另外一个域名下的Cookie该如何操作?

133.vite 和webpack 在热更新上有啥区别?

134.封装一个请求超时,发起重试的代码

135.前端如何设置请求超时时间timeout【必会】

136.nodejs如何充分利用多核CPU?【字节二面】

137.后端一次性返回树形结构数据,数据量非常大前端该如何处理?

138.你认为组件封装的一些基本准则是什么?

139.页面加载速度提升(性能优化))应该从哪些反向来思考?

140.前端日志埋点SDK设计思路

141.token进行身份验证了解多少?【腾讯一面】

142.在前端应用如何进行权限设计?【字节二面】

143.【低代码】代码平台一般消染是如何设计的?

144.【低代码】代码平台一般底层协议是怎么设计的

145.【Webpack】有哪些优化项目的手段?

146.IndexedDB存储空间大小是如何约束的?

147.浏览器的存储有哪些【腾讯一面】

148.【Webpack】如何打包运行时chunk,且在项自工程中如何去加载这个运行时chunk?

149.为何现在市面上做表格泊染可视化技术的,大多数都是canvas,而很少用svg的?

150.在你的项目中,使用过哪些webpack plugin,说一下他们的作用

151.在你的项目中,使用过哪些webpackloader,说一下他们的作用

152.【React】如何避免不必要的染?【美团一面】

153.全局样式命名冲突和样式盖问题怎么解决?

154.【React】如何实现专场动画?

155.【React】从React层面上,能做的性能优化有哪些?

156.【VUE】中为何不要把v-if和v-for同时用在同一个元素上,原理是什么?

157.将静态资源缓存在本地的方式有哪些?

158.SPA首屏加载速度慢的怎么解:决

159.axios是如何区分是nodejs环境还是浏览器环境的?

160.如何拦截web应用的请求

161.前端有哪些跨页面通信方式?

162.H5下拉刷新如何实现?

以下:github.com/encode-stud…

163.如何修改第三方npm包?

本篇内容到此结束,以上内容只展示部分

最后祝大家11月面试顺利,