news 2026/5/14 13:01:34

干了五年前端,说下一次过面试的感受!

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
干了五年前端,说下一次过面试的感受!
顺道再来说些实战经验

1.算法手撕没啥捷径,靠刷题就能保底。我那时对自己挺狠,每天雷打不动10道LeetCode,5道简单5道中等,逼自己90分钟内必须全AC。练的就是两个:看题要准,写码要稳。边界条件与异常处理必须一次过,尤其是涉及数组、字符串和树类的前端高频题型。

2.语言与框架特性理解是关键。每天至少深挖1-2个核心机制,比如EventLoop、闭包、原型链、Vue响应式原理或React Hooks的实现逻辑,做到看到代码能反应出执行顺序和状态变化。模块化、依赖管理、性能优化的思维已经决定了日常怎么写才稳健。

3.高频手写题把这几类吃透:Promise(all、race、并发控制)、函数式工具(防抖/节流/柯里化)、DOM操作(事件委托、动态渲染)、数据结构转换(对象扁平、树遍历)。保证看到就能5分钟内写出健壮版本,面试时一眼扫过去,清晰的直接拿下,复杂场景先确保基础解法,再谈优化。

4.浏览器与网络知识是拉开差距的关键。这部分我花的时间最多,每天固定1小时,从渲染机制、缓存策略、HTTP/2、Web安全分块练,每块都搭配实际案例调试。第二天看新内容前,先用Performance面板或Lighthouse把前一天写的页面再过一遍,分析加载、渲染与交互问题。

5.工程化与构建工具涉及面广,全靠背不现实。我每天利用通勤或午休这种碎片时间,快速看2-3篇高质量文章或官方文档选节(比如Webpack优化、Vite原理、CI/CD配置),不求记住所有细节,建立概念索引就行,知道遇到问题该查哪、怎么配。

6.项目复盘的话,我比较重视‘难点与解决’部分,这里提分空间大。要会归纳问题本质,分点陈述方案,比如首屏加载慢、内存泄漏、复杂状态管理,总结出技术选型的权衡,逻辑清晰,每条都用技术语言准确描述,尽量使用量化数据(如Lighthouse分数提升X%、打包体积减少Y%)支撑。

7.架构与设计能力想要提升,还是要多积累。我一般是看优秀开源项目源码(如Vue、React生态库)、大厂技术架构分享和博客。建立一个自己的案例库,分类整理各种场景的设计模式、状态管理方案、性能优化策略,每周定期回顾,并尝试用绘图工具重画一遍加深理解。

这里说一句:前端面试,尤其是社招,面到深处就是在验证你的工程直觉和调试韧性。上面这些‘笨办法’,是我从一次挂、两次挂里试出来的!同时,希望下面这些面试题对你有用。

总览:

一、Vue面试题

  1. 说说vue动态权限绑定渲染列表〔权限列表渲染)
  2. Vue用的哪种设计模式
  3. 说说vue操作真实dom性能瓶颈
  4. Vue中如何获取dom、操作dom、更新dom
  5. Vue的双向数据绑定原理是什么
  6. mvvm框架是什么
  7. 谈谈Vue的token存储
  8. 知道nextTick的作用吗,谈谈对它的理解,是什么,怎么用
  9. nextTick和setTimeout区别
  10. vue中为什么用虚拟dom而不操作真实dom
  11. Vue如何进行组件传值
  12. 说说vue里面的父子通信
  13. 谈谈如何实现vue组件通信和传值方式(两个问题为同一个答案问法不一样)
  14. 说说vue中Key值的作用
  15. 说说vue中的虚拟dom和diff算法
  16. vue3.0有了解过吗,你觉得vue3.0好吗,好在哪
  17. VUE组件如何与iframe通信问题

二、 React面试题

  1. 说说React中onClick绑定后的工作原理
  2. 说说react里面bind与箭头函数
  3. 说说react中的性能优化
  4. 高阶组件和高阶函数是什么
  5. setState和repalceState的区别
  6. redux中核心组件有哪些,reducer的作用
  7. 什么是受控组件
  8. hooks+context和redux你是怎么选择的,都在什么场景下使用
  9. useffect模拟生命周期
  10. setsate更新之后和usestate的区别
  11. react父组件props变化的时候子组件怎么监听
  12. usememo在react中怎么使用
  13. React Hooks各种函数介绍
  14. React Component和Purecomponent区别
  15. hooks相对于class的优化
  16. hooks父组件怎么调用子组件的方法
  17. 讲一下react中的通信
  18. react通过什么方法修改参数
  19. 说你对react native的了解
  20. redux的实现原理

三、小程序面试题

  1. 简单谈谈微信小程序
  2. 小程序的原生组件有哪些
  3. 小程序的安卓版和ios版是怎么开发出来
  4. uni-app弹窗被覆盖怎么解决
  5. 小程序生命周期
  6. 小程序路由跳转
  7. 小程序的兼容问题有哪些
  8. 小程序框架都学握哪一些,uniapp都会哪一些,平时开发遇到的困难
  9. 小程序怎么获取手机号
  10. 小程序的登录流程
  11. 小程序如果版本更新了怎么通知用户
  12. 小程序嵌入H5页面怎么做
  13. 小程序的生命周期函数有哪些?分别有什么作用?

四、Webpack面试题

  1. webpack了解吗,讲一讲原理,怎么压缩代码
  2. webpack怎么配置
  3. webpack怎么打包
  4. vue打包内存过大,怎么使用webpack来进行优化
  5. webpack打包用过什么插件
  6. 说说gulp和webpack的区别

五、TypeScript面试题

  1. 了解过TS吗?
  2. 使用ts写一个对象属性约束
  3. 说一下typescript中的泛型
  4. 如何在TS中对函数的返回值进行类型约束
  5. ts和js相比有什么区别
  6. RX了解吗?

六、Node.JS面试题

  1. 说说对nodejs的了解
  2. nodejs如何写接口,返回参数如何处理,有多少种方法
  3. websocket和http的区别
  4. 常见的 HTTP Method有哪些?GET/POST区别?
  5. 说一说Tcp三次握手,四次挥手
  6. 阐述一下http1.O与http2.0的区别,及http和https区别
  7. node.js如何导出页面数据形成报表
  8. 协商缓存和强缓存
  9. 强缓存
  10. Expires
  11. Cache-Control
  12. 协商缓存
  13. Etag和If-None-Match
  14. Last-Modify/lf-Modify-Since
  15. 为什么要有Etag
  16. http常用状态码有哪一些,说—说他们的作用
  17. 网络攻击方案有哪些,自己有写过什么安全性方面的东西吗?
  18. 静态资源部署到哪?
  19. 说说你对nodejs的了解

七、GIT面试题

  1. git经常用哪些指令
  2. git出现代码冲突怎么解决
  3. 你们团队是怎么管理git分支的
  4. 如何实现Git的免密操作

八、其它面试题

  1. loadsh了解过吗?
  2. 是否用过混合APP开发
  3. 项目中的组件是如何使用的
  4. hash和histoty的原理
  5. window.location.href和history.push的区别
  6. 商城项目中有写到调用微信,支付宝支付,简单讲述—下
  7. 这个支付与后台对接的过程,微信支付的原理
  8. 混合开发知道吗?你是怎么理解混合开发的,在项目中用到过混合开发吗?
  9. 平时工作中有是香有接触linux系统?说说常用到linux命令?
  10. echarts是什么,怎么用
  11. Hash和history的区别
  12. 谈谈宏任务与微任务的理解,举一个宏任务与微任务的api
  13. 对Event loop的了解?

有想要: https://github.com/encode-studio-fe-coder/natural_traffic/wiki/scan_material3
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/23 12:53:31

ModelScope终极部署指南:从零到精通的完整实战手册

ModelScope终极部署指南:从零到精通的完整实战手册 【免费下载链接】modelscope ModelScope: bring the notion of Model-as-a-Service to life. 项目地址: https://gitcode.com/GitHub_Trending/mo/modelscope 想要在本地环境中高效运行ModelScope的700先进…

作者头像 李华
网站建设 2026/5/12 13:34:12

为什么你的TS视频总是卡顿?3个实用技巧彻底解决播放难题

为什么你的TS视频总是卡顿?3个实用技巧彻底解决播放难题 【免费下载链接】alist alist-org/alist: 是一个基于 JavaScript 的列表和表格库,支持多种列表和表格样式和选项。该项目提供了一个简单易用的列表和表格库,可以方便地实现各种列表和表…

作者头像 李华
网站建设 2026/4/23 13:04:04

OpenAI 20B无审查MOE:80T/S全能AI编程神器

OpenAI 20B无审查MOE:80T/S全能AI编程神器 【免费下载链接】OpenAi-GPT-oss-20b-abliterated-uncensored-NEO-Imatrix-gguf 项目地址: https://ai.gitcode.com/hf_mirrors/DavidAU/OpenAi-GPT-oss-20b-abliterated-uncensored-NEO-Imatrix-gguf OpenAI推出的…

作者头像 李华
网站建设 2026/4/23 17:53:27

Stability AI模型下载实战:从零到一的避坑指南

Stability AI模型下载实战:从零到一的避坑指南 【免费下载链接】generative-models 是由Stability AI研发的生成模型技术 项目地址: https://gitcode.com/GitHub_Trending/ge/generative-models 你是否曾经满怀期待地开始下载AI模型,却在几个小时…

作者头像 李华
网站建设 2026/5/13 0:12:19

AIOpsLab:自动化运维故障演练的终极指南 - 快速上手与实战应用

AIOpsLab:自动化运维故障演练的终极指南 - 快速上手与实战应用 【免费下载链接】AIOpsLab 项目地址: https://gitcode.com/gh_mirrors/ai/AIOpsLab 想要构建智能运维系统却苦于缺乏真实故障数据?AIOpsLab正是您需要的开源解决方案。这个专为自动…

作者头像 李华