谦谦橘子2024年度总结与面试心得

6 阅读7分钟

一. 2024年历程

1.1 裁员

2024年对我来说应该是职场生涯遇到的第一个重大挫折,即被裁员。那个时候感觉人生都跌入谷底,彻底丧失了动力,看不到一点未来。

在上家公司的工作心态在后期阶段变得很差,卷又卷不动,躺又躺不平,自己觉得做的有价值的东西在别人眼里也不过如此,得不到正向反馈又进一步加深自己的精神内耗,最后进入了公司的裁员名单中,作为边角料被淘汰。

不过好在给到了相应的补偿金,这也成为我后续计划的启动基金。

1.2 旅游

离职之后我去找我女朋友,当然我没有告诉她我已经离职了,瞒着她说自己跟公司请了一段时间的休假,工作都交接给同事负责,偶尔回下工作上的消息即可,起初她也没有多想。

我先去的女朋友老家,认识了她的家人和朋友,欣赏本地美食,体验农家乐,有一说一,她老家的水果如草莓,芒果都很好吃。

接着我们开始计划要去的城市或旅游景点,如上海,台州,乌镇,潮汕,武汉,成都,桂林等很多地方,欣赏各个地方的美食和游玩知名的景点,如上海的迪斯尼,台州的海鲜,武汉的冰镇小龙虾,桂林的漂流等等。那段时间真的很快乐,没有任何工作上的干扰,能和自己喜欢的女孩子自由自在的生活。

1.3 闭关修炼

旅游结束之后我回到了老家闭关修炼,为后续的面试和工作做更多的知识储备。

首先是重新梳理基础知识,然后花了很多的时间精力去阅读一些日常工作常用工具或框架的源码,加深自己的理解,如webpackbabelReact。同时也花了一些时间去扩充自己的技术广度,如了解业界优秀的技术方案或工具。

最后攻克数据结构和算法,算是修炼内功吧,更实在目的是为了应付面试。

二. 面试心得

这部分内容主要是根据笔者面试经历总结而来,作为参考即可。

2.1 职位要求

2.1.1 业务方向

  • 在线文档,如富文本,多维表格,协同编辑
  • 音视频,如编码
  • AI,如AI Agent
  • 数据可视化,如地图
  • 低代码
  • Web3,如智能合约
  • 跨端,如小程序或混合开发
  • 游戏开发引擎,如直播间小游戏

2.1.2 技术方向

  • 掌握前端框架React/Vue,理解核心原理
  • 掌握前端工程化工具,如WebpackVitebabel
  • 掌握跨端框架,如ReactNative/Flutter/uni-app,小程序多端统一框架Taro或桌面端Electron
  • 掌握服务端框架,如Nodejs
  • 具备全栈开发能力,如mysql/mongoDBredisdocker
  • 掌握AI相关工具,如AI代码编辑器
  • 掌握业界主流解决方案,如微前端架构,服务端渲染等
  • 掌握数据可视化框架,如canvasthreejscesiumjs
  • 掌握前端常见问题解决能力,如性能优化,内存泄漏或SEO
  • 游戏开发引擎,如cocos
  • 原生开发,如iOSAndroid

2.2 技术要求

2.2.1 HTML

  • 什么是HTML
  • HTML标签
  • HTML属性
  • HTML文档

2.2.2 CSS

  • 什么是CSS
  • CSS选择器
  • CSS优先级、继承、层叠
  • CSS单位
  • CSS属性
  • CSS布局
  • 盒模型
  • BFC

2.2.3 JavaScript

  • 什么是JavaScript
  • 基础数据类型
  • 隐式类型转换
  • 事件机制,如事件代理/委托或事件冒泡/捕获
  • 闭包/作用域链
  • 原型链
  • 变量/函数提升
  • this指针
  • 正则表达式
  • 函数式编程
  • 异步编程,如promiseasync/await
  • 数据常用方法,如splicefillconcat
  • es6+语法,如扩展运算符、Set/Mapclass
  • 暂时性死区,如letconst
  • 手写节流/防抖
  • 手写callapplybind
  • 手写new
  • 手写深拷贝
  • 手写promise

2.2.4 计算机网络

  • HTTP
  • HTTPS
  • TCP/UDP
  • Cookie
  • 缓存策略,如强缓存/协商缓存
  • MIME类型
  • 常见Web攻击,如XSSCSRF
  • HTTP/1HTTP/2HTTP/3的区别及应用场景
  • DNS域名解析
  • 网络五层模型,即应用层,传输层,网络层,数据链路层和物理层

2.2.5 浏览器

  • Event Loop原理及常见的宏任务/微任务
  • 浏览器进程/线程
  • 垃圾回收机制
  • 浏览器渲染流程原理
  • 同源策略及常见跨域问题解决方案
  • setTimeout/setInterval/requestAnimationFrame/requestIdleCallback的区别及应用场景
  • WebWorkerServiceWorker的区别及应用场景
  • localStorage/sessionStorage/cookie/indexedDB的区别及应用场景
  • V8引擎
  • 性能优化指标,LCP/FCP/TTFB/CLS/INP

2.2.6 前端工程化

  • 包管理器,如npmyarnpnpm
  • js代码转换器babel
  • 模块打包器,如webpackviterollup
  • monorepo
  • 类型校验,如TypeScript
  • 代码规范,如eslintstylelintprettier
  • Git规范,如husky
  • 代码质量,如单元测试/E2E测试/代码覆盖率等
  • 服务稳定性,如灰度发布或前端监控等
  • 脚手架,如接口生成工具
  • CSS框架/预处理器,如tailwindcssless/scss
  • webpack高阶功能,Tree Shaking/代码分割/动态加载/热更新等

2.2.7 前端框架

2.2.7.1 React
  • Fiber架构,如DOM树颗粒度更新,异步渲染,优先级任务调度机制等
  • 事件合成机制
  • 常用Hook原理,如useState/useEffect
  • 异常处理,如ErrorBoundary
  • 异步操作,如use/Suspense
  • 服务端渲染API,如renderToString/renderToPipeableStream
  • class/function编程方式优缺点
  • 状态管理框架,如zustand/redux
  • 数据请求管理框架,如react-query/use-swr
  • 路由框架,如react-router
2.2.7.2 Vue
  • 虚拟DOM树颗粒度更新机制
  • Vue2/Vue3响应式原理
  • keep-alive原理
  • watch原理
  • $nextTick原理
  • 自定义指令
  • 路由守卫鉴权机制
  • v-if/v-show的区别及应用场景
  • 状态管理框架,如pinia/mobx
  • 路由框架,如vue-router

2.2.8 解决方案

2.2.8.1 微前端架构
  • 什么是微前端,优点/缺点,应用场景
  • 微前端框架,如qiankunmicroappwujie
2.2.8.2 服务端渲染
  • 什么是服务端渲染,优点/缺点,应用场景
  • 服务端渲染框架,如Next.js/Nuxt.js
2.2.8.3 跨端
  • 常用的跨端框架
  • 混合开发

2.2.9 常用工具

  • 响应式编程库rxjs
  • 数据不可变更库immer
  • 数据请求库axios
  • 工具库lodash-es
  • React Hooks@uidotdev/usehooks

2.2.10 数据结构与算法

刷透leetcode hot 100,掌握每道题背后的算法思想及解题框架,要能做到以一反三

2.2.10.1 数据结构
  • 字符串
  • 数组
  • 链表
  • 栈/队列
  • 二叉树/多叉树
  • 哈希表
2.2.10.2 算法
  • 双指针
  • 二分查找
  • 滑动窗口
  • 单调栈/队列
  • BFS/DFS
  • 排序算法
  • 动态规划
  • 贪心思想

2.3 感悟

在大环境不好的背景下,公司对候选人的选拔要求也日益严格,首先在学历这块基本要求本科以上,甚者明确要求985/211高校。

其次在对候选人的技术要求上,要有足够的技术深度和技术广度,甚者明确要求有原生iOS/Android开发经验或全栈开发经验如掌握后端开发语言Java,美名其曰为大前端。

最后在薪资这块,以中小型公司或外包公司为例,即既想要能力好的且能低薪资招聘到的候选人,最好能够是愿意付费上班的。

笔者在历经三个月的找工作过程中,遇到各种形形色色的猎头、面试官和hr,深受启发,好在最终能寻找到欣赏笔者的伯乐,得以结束这操蛋的历程。

三. 总结

2024年对我来说是难以忘怀的一年,有挫折,有自由,有无奈,有惊喜。在这个机遇日益稀少的时代,更需要不断突破自身能力上限,当机遇到来时才不至于因为能力不足而与之擦肩而过。为了能够与所爱之人回到地面,自由自在的生活。