阅读 3692

21 届前端暑期实习 BAT 面试之路,已上岸阿里(万字长文)| 掘金技术征文

笔者就读于杭州师范大学(世界上最好的大学),感谢在这里的三年,遇到的同学和导师!

笔者在大二开始自学 Web 开发,大二上学期做的 Java 后端,大二下学期转前端,和导师做了两个商业项目。

从今年二月初准备简历,开始复习整理知识点,投递了字节腾讯阿里百度,经历大大小小的面试,最终到 4 月 17 日 接到阿里盒马意向书已经两个半月了,期间也经历过 burnout 的阶段,不过结果还是好的,现在希望通过这一篇文章,将大学里最重要的这两个月总结一下,也给大家做一些原创的分享。

截止至发稿,目前

  • 字节抖音挂
  • 腾讯 PCG 口头 offer,未接
  • 阿里盒马已上岸
  • 百度车联网,OC未接

面经

我会按照首次(一面)开始的顺序来写,腾讯 PCG,字节抖音,阿里投递的 BU 比较多,最后是百度统招(部门未知)。

为什么是这个顺序?因为我的春招,准备和投简历是同时开始的,也就是说我刚开始是比较薄弱的,知识点没复习,面试经验不够,这些都是一边面试一边总结出来的。

蚂蚁金服两轮(直通终面)

一面(电话 1h10min)

二月中旬面试,当时还是个小菜鸟,面试官很 nice,一直鼓励我,说我的项目经历丰富,愿意多挖掘我一点。我当时怕是对“挖掘”二字有什么误解,竟然还开开心心说了个“好哒”。后面对于当时还是菜鸟的我简直就是炼狱难度。

  • 自我介绍
  • 输入 URL 发生了什么?不要说网上的模版,用你自己的理解来说说看。
  • 深入说说 DNS?(两种查找、回源、可以做负载均衡、缓存优化、和 CDN 的关系)
  • React 生命周期?
  • 说说你遇到过的 React 报错,说说报错的原因?如何解决?(定时器忘记卸载,组件循环等等…)
  • React router 的原理了解吗?
  • Mobx 的原理了解吗?原理是什么?
  • Mobx 和 React 的连接是怎么做的?(mobx-react 库)那么这个库的源码看过吗?做了什么优化?(跪了)
  • 说说虚拟 DOM
  • React 组件通信?
  • React Hooks 了解吗,解决了什么问题?
  • Pure Component 和 memo?
  • ES6 你了解哪些 API?(说了一些常见的)
  • Promise 的原理了解吗?链式调用是如何实现的呢?
  • 撕代码:看了下我的博客,发现有一篇讲自己刷算法题的经历,就说先来做一个题,leetcode 的 hard 难度二叉树,我傻了,写了 20 分钟最后还没写出来…

现在再回头看这些问题都没那么难啊(扑哧…),但是当时回答磕磕绊绊。这就是一个教训啊:早点开始准备实习面试!!!

二面(电话 40min)

一面完没过几天来二面,这是一轮压力面,面试官语气很严肃,时不时会用责备的语气来说。当时还是小菜鸟,很多问题是第一次问到,特别是源码和原理还没来得及复习。

  • 说说你的项目吧。
  • 你项目有什么难点?(说了性能优化和自拍旋转)
  • 前端学了多久了?(一年)
  • 对 React 原理了解吗,看过源码吗?
  • 说说 setState 吧,背后的原理了解吗 (问懵逼了,事后想想虽然没看过源码,但是批量更新、同步异步、虚拟 DOM 都是可以说的,我当时大脑就一直陷于“源码没看过,完了完了我完了”)
  • 那你还有什么了解比较深入的地方吗?(没很好地回答出来)
  • 那你就是仅限于会用的阶段,没去了解过原理这块?(我跪了,一直在了解,但是主要是游览器原理、Js 设计模式这块,React 原理还有些没看,其实是可以引导面试官来问我已经复习过的地方的,比如 Router 的原理,Mobx 的原理,游览器原理等等,但是当时屈服在面试官的“威压”之下,支支吾吾回答了个“嗯…”)
  • 你觉得自己的优点是什么?缺点是什么?(扯了扯)

面完后非常沮丧,但是问了下内推小姐姐我竟然过了…

字节跳动—抖音火山版两轮(二面挂)

第一次视频面试,发挥不是很好。

一面(视频 50min)

  • 撕代码:二叉树找一条路径之和为 k。
  • CSS 的 position?
  • 撕代码:手写防抖,有头无尾,时间戳搞定
  • 说说 HTTP 缓存
  • 说说 DNS 缓存
  • 项目难点?(balabala…)

二面(视频 40min)

  • CSS 的 postion 有哪些属性,都有什么特点?比较特殊的是哪个?
  • 做一个 三栏布局放图片,图片之间间隔 20px
  • 项目难点?优化做了哪些内容?(balabala…)
  • HTTP 缓存
  • 撕代码:给出 DOM 根元素,递归求出所有子元素存放在数组里
  • 跨域和 cookie ?

腾讯 PCG 三轮(口头 offer)

一面(电话 1h)

面试官给人感觉很好,是广东口音,就是电话声音不太清楚,最后转到 QQ 语音。面试题量很大,但是非常深入的问题并不多。

  • 为什么选择前端?
  • 你是如何学习前端知识的?(Youtube 快速入门,然后 GitHub 找项目读,看国外博客,订阅 weekly、newsletter 了解最新进展)
  • 看哪些书?(你不知道上卷,忍者秘籍,深入 ES6,精通 CSS 第三版)
  • 了解 CDN 吗?CDN 为什么让你更快访问资源?(先说到 DNS,后来发现方向偏了,又圆了回来)
  • 常见状态码有哪些?
  • HTTPS 和 HTTP?(TLS/SSL)
  • (深挖)你说到 TLS 也会进行一次握手,具体是怎么做的?
  • (深挖)那么加密过程是怎么样的?(中间人攻击,对称加密的缺陷,非对称加密的原理-公钥私钥对)
  • HTTP 缓存?强缓存、协商缓存什么意思?(不会…面试官说没事,结果下面又问了我缓存 T T)
  • 什么是闭包?
  • 说说你会的 ES6 吧?(联系平时写 React 的场景,代表是真的用过的)
  • (深挖)说说 let 和 var 的区别?(提升,块作用域)
  • (深挖)Babel 如何将 ES6 转 ES5(其实是问 Babel 的原理,我返乡回答 JSX 如何通过 Babel 转 js 表达自己了解 Babel)
  • React 的生命周期?
  • (深挖)遇到过什么问题?比如在 willUnmount 里面 setState()
  • (深挖)setState 的执行时机?(提到 Event Loop 以及事务代理)
  • (深挖)那你了解过 PureComponent 吗 (结合新的 React.memo() 说了一下)
  • 什么是 PWA?
  • ServiceWoker 是什么?(可以做全缓存,离线可用...)
  • (深挖)那么和游览器缓存的那个先哪个后?(不会)
  • 遇到过跨域问题吗?如何解决?(加 cors 包,一键解决)
  • (深挖)那么这个 express 的 CORS 库的原理是什么?(就是 CORS 的原理)
  • (深挖)还有什么别的办法吗?(jsonp-提到之前做过京东的网站分析,或者用 node 做一层代理)
  • 如何实现居中布局?flex 怎么设计?
  • 手撕一个算法——最大连续子序列,经典 dp。

二面(电话 40min)

到这里我 React 原理已经准备的差不多了,没想到二面面试官并没问 React 原理…

  • SPA 前端路由的原理
  • (深挖)Browser Router 的原生实现方法
  • HTTPS 多一次握手(TLS 握手),具体过程?
  • 跨域问题如何解决?

其他问题由于失误没有记录下来。

三面(视频 40min)

面试官是个知名大佬,我说话都哆嗦,发挥不是很好。问题也有很基础的,出乎意料。

  • 什么时候能来实习?实习时间?
  • 对于城市的选择?
  • 对于团队的选择?
  • 一个智力题,计算概率的,不难。
  • 一个关于 transform 的 CSS 问题(没有回答好,我 CSS 不是很熟练)
  • 原生 ajax 请求过程,js 实现过程,promise 封装。
  • 项目难点?(项目比较多,balabla 说了一堆)
  • (深挖)你项目里这个加载时间如何计算的?之后前端监控相关的聊了一会。
  • 手撕代码:一个 dp 题。

阿里云两轮(直通终面)

没记录。

印象里题目偏难,很多是常规题的进一步深挖和扩展,以及场景题。

笔试题比较开放,做一个 webpack 可选链,我当作完整项目来写,评价不错。

github.com/HytonightYX…

阿里菜鸟网络三轮(直通终面)

一面(电话 1h20min)

一面是位主管,说话比较快,给人感觉比较严肃利索。而且一开始聊了很多非技术问题,结尾又和我聊了很久菜鸟的业务和发展,聊下来感觉很好,并且在之后经常打电话回访我的状态,问我几个 BU 的选择,感受到主管的关心。

  • 兴趣爱好,谈社会,谈书籍
  • 谈如何学习,自己的优点,缺点,他人对自己的评价
  • 大学生活,最自豪的事情
  • 说说 React 状态管理,Mobx 的原理
  • 看过哪些源码?
  • 平时怎么学习前端?你说到 react conf,最近几届的主题都是什么?
  • (深挖)说说 fiber 架构
  • 谈谈 DNS
  • 有什么问题?我问了技术栈是什么,结果被面试官说了,不要这么问,要问部门业务、技术和长期规划,然后这三个点给我介绍了十几分钟,感觉很真诚

面完后直接告诉我,我通过了,明后天会让他的同事来重点考察我的基础,让我好好准备下。

二面(电话 50min)

真的全问基础,没有涉及项目的问题。但是回答的时候最好结合自己的实际经历来回答。比如闭包,我结合自己项目里用到的场景来辅助。

  • JS 的原始类型?(答案是 7 种,并且重点说了下 bigint 和 Symbol)
  • 怎么理解闭包?
  • 实现动画有几种方案?
  • JS 去实现动画要注意什么?
  • flex 布局两个子元素居左右?
  • 说说事件循环?
  • react fiber 原理?
  • React 的 setState 原理?
  • 什么时候会造成 React 组件刷新(render())?
  • 谈谈高阶组件 HOC?
  • 项目里的性能优化是怎么做的?
  • 模块化的演变?
  • 简单说说 Webpack 是如何实现打包构建的?

三面(电话 26min)

  • 自我介绍

  • 谈谈职业规划

  • 你刚才提到想做架构,你说说你对前端架构的理解。(从前端历史角度谈前后端分离,前端工程化框架,自动化,CI/CD,前端监控、埋点,设计模式,负载均衡,缓存,kafka 到数据库等等聊了十几分钟,角度比较多)

  • 你还有什么问题?

面试完之后,一面面试官打电话来说我过了,会将我录入系统,直通终面,提醒我到时候确认。

阿里盒马六轮(已接 offer)

盒马是流程最长的一次面试,前后大约有一个半月,但是面试下来感觉很好,和盒马面试官也比较搭。我看好盒马多样化的、全链路的业务体系,所以选择了盒马继续终面,最后也拿到了 offer。

一面(电话 1h)

  • 如何实现一个 ORM 库(一开始问这个没反应过来,后面才慢慢说出来,说到设计的思路)
  • Koa 后台怎么做的?(全局异常处理,中间件鉴权,参数校验)
  • 鉴权方面怎么做的?
  • (深挖)按你的这个设计,如果访问一张图片经过你的接口也会鉴权进而导致跳转登录页面,这个如何解决?(这是个当时做系统没考虑到的问题,回答得不好)
  • React 父子组件如何通信?
  • React state 和 props 的区别?
  • 如何封装一个请求数据的组件?(UI 和业务分离,单一职责,高阶函数)
  • Tree 型 Sesect,如何这棵树太大会卡顿,怎么做优化?
  • 另外,搜索的时候数据太多,怎么做?(节流等等)
  • 基础题:给一段异步代码,问输出的顺序(考察游览器事件循环,宏、微任务等等)

二面(电话 40min)

主要问了 React

  • 介绍项目的难点(说了很多)
  • cookie、session 了解吗?说一下传统的登录流程?
  • fiber 架构概述
  • diff 原理概述
  • setState 原理,两种传参方法,联系到 setState 可能异步也可能同步,说了 setState 的流程,内部机制,React 的事务机制等等。
  • 函数式编程?柯里化?
  • node.js 了解吗?说说 node 和游览器的事件循环机制

三面 (电话 1h)

  • leader 先和我介绍了 20 分钟部门业务,太棒了
  • 聊自己的项目,自己担任什么角色,做了什么事情,攻克了什么难点
  • 心目中的团队是怎么样的?
  • 聊理想

四面—技术终面(电话 1h)

  • 介绍你的项目难点?(讲了 20 分钟)
  • 你说到状态机的优化,具体怎么做的?优化到哪几个状态?
  • 你说到 API 的复用,这么设计可能会导致某个 API 的压力过大,能否重新设计下?(BFF 架构)
  • 性能优化,结合实践场景说一说(不能是简单的罗列,还要说应用了这个技术打包减少了多少,加载时间减少了多少)
  • 你说到图片被自动旋转的问题,你做了逆操作;那么这个事情前端和后端都可以做,你是怎么选的?、
  • 你来实习,有哪些目标?想学到什么,做到什么?

五面—交叉面(电话 40min)

面试官是天猫 P9

  • 项目难点(说了准备好的一大串,从零做商业项目的设计思路、和客户的沟通等等以及笔记平台的性能优化过程。)
  • 性能优化怎么做的?
  • 深入:你说几秒优化到几秒,你这个是怎么测出来的?
    • 深入:前端性能监控相关、数据埋点相关
  • 平时参加哪些竞赛?担任什么角色?
  • 你有什么问题?
  • 进入阿里的职业发展

HR 面(电话 30min)

  • 自我介绍
  • 项目负责什么?
  • 职业目标
  • 坚持最久的事情?(前端)
  • 想过放弃吗?(没有)
  • 对你影响最大的人是谁?
  • 说一件自己受过批评的事情?
  • 说一件自己作为 leader 推动过的事情?
  • 你还有什么问题?

百度(OC未接)

一面(视频 40min)

一面是个高冷的小姐姐面试。

  • 自我介绍
  • 介绍 webstorage、cookie 的区别
  • 说说 XSS 攻击,怎么防御
  • 302 状态码是?和 301 有什么区别?
  • 说说你的性能优化过程?(balabala…)
  • webpack 配置过程?常用插件?
  • 跨域问题怎么解决?
  • 考虑过移动端优化吗?
  • 撕代码:深拷贝
  • 平时怎么学习前端的?(问的挺深的,还当场让我把看过的资料发给他)

二面(视频 40min)

二面开始偏项目了,也是小姐姐面试。我有些题目答不好会尬笑,她也会一起尬笑,哈哈。

  • 自我介绍
  • 说一下移动端优化
  • 你项目里的 OAuth2 登录怎么做的?
  • 项目怎么部署的?
  • 怎么知道是移动端访问还是 PC 端访问?
  • 如果要同一个域名,但是根据访问设备的不同来访问不同的项目,怎么做?(nginx 判断设备,反向代理到不同的端口)
  • 你项目的技术选型时怎么做的?
  • 自我介绍时候提到你想做架构,能说说你的职业规划吗?
  • 撕代码:Promise 封装 ajax
  • 常规代码题:给出一段异步代码,套了很多 async/setTimeout/Promise 等,问你执行顺序,考察事件循环

三面(视频 50min)

三面是个瘦瘦的大叔,应该是类似总监一般的人物。头发很少,说话很温和,称呼我都说“您”,好感度 upup。不过不管是哪家大厂,总监面都会说到性能监控和埋点,以及性能的量化,小伙伴们好好准备呀。

  • 自我介绍
  • 说说项目难点(balabala…)
  • 说到性能优化,你是怎么记录的?(说完,继续说可以做埋点,可以做性能监控)
  • 怎么定义首屏加载时间?(一开始说错了,然后慢慢圆回来,感谢面试官的提醒)
  • 你们项目的今日精选和今日最热模块是怎么做的,用了什么算法?
  • 具体说说职业规划,比如前几年做什么,后几年做什么。
  • 平时怎么学习前端的?
  • 说说你选择城市的依据?
  • 谈谈决定你选择公司和团队的三个决定性因素?
  • 百度这边你有想进的团队吗?
  • 你还有什么问题?

面试官评价自己还不错。

写给自己:回顾过去的路

玩计算机是我小时候的理想吧。

小时候由于家庭工作原因,比较早摸到了计算机,开始打暴力摩托 1998,玩红警,和老爹同事偷学计算机维修技术,初中做了三年电教管理,高中把教室里的计算机拆了个遍(没少挨骂),然后开始迷恋硬件 DIY,高二才终于组了自己人生第一台 PC(多谢爸妈打赏),高中学了学 VB,浙江技术高考拿到满分,大学顺利就读计算机科学与技术,正式入坑编程。

2017 年入学,大一也迷茫,天天刷知乎找方向,看行业动态。先跟着课程学吧,学 C 语言,刷题,参加 ACM 集训被吊打,发现自己算法搞不过各位大佬,于是转而去研究人工智能深度学习,跟着吴恩达的课程看一看,学Python,装 TensorFlow 开始做 Demo,最后搞了个教务系统的爬虫,能自动识别出验证码登录。

大一快结束了一看,不对劲。这深度学习搞下去都是数学啊,自己概率论都还没学,看论文脑壳疼,深感这东西凭自己的能力自学不了,得有大佬来带我,还要有钱!没钱你 CPU 跑模型玩呢,看人家 GTX1080Ti 跑的的多快。我没钱没资源没老师,立即推:学这玩意儿先考研,去名校。

这个时候规划了一下这几年,我要进大厂。那要不要考研呢?既然考研还是为了进大厂,那我为什么不本科就冲一冲呢?另外我对考试这东西不擅长,考不过别人,我喜欢实践,动手。

好,继续查查别的路径。这时候恰好遇到个Java Web项目,用的是JeeSite 2.x,能自动生成代码模版的那个,我靠,有项目做,还是可以上线的商业项目!赶紧自学 Java,配 Java Web 环境配了好几天,顺便学了翻起昂,jQuery。吐槽下,这是个历史遗留项目,配环境极其困难,因为要去找老版本,tomcatMavenJava 之间似乎还有某种奇怪的版本对应关系,一开始还不知道,瞎配,我吐了。

这个项目最后学长学姐带着我们做好了,历经坎坷,虽然给别人打工却一分钱没拿到,但是帮我打开了新世界的大门:Web 开发,这个挺有意思。

于是大二开始,再次改变路径,正式入坑 Web 开发。自学JavaSpring那一套,入门有点儿困难,但是理解了DIAOP就有种顿悟的感觉。顺便把数据库了解下,前端再套个thymeleaf + jQuery,我第一个网站就出来了,是个图书网站,类似豆瓣读书那种。

通过SpringMVC,又接触到了设计模式。于是看书《Head First 设计模式》,了解了什么单例,工厂之类的。学了一个学期,网站没做几个,Java 课程设计倒是写的还行,用的是 Java FX,原生支持 MVC。

大二上学期结束之后,我遇到了现在的导师 L,我们聊了很多,很谈得来,我也很想去他的实验室,跟着他学习。但是 L 导师有个要求,前端用React,后端用Node.js。我 Java 学了一个学期了,哪是那么容易放弃的,我就说,我三个一起学。

真是一入前端深似海,和我之前的模板+ jQuery 写网页完全不一样,这组件化的开发方式深得我心。Node.js轻量点,前后端语言统一,代码相比 Java 少一点。后来在使用方面,Node越来越多,Java也就没有继续学下去了。

现在回忆起来,当时面临选择Java还是Node.js都纠结万分,现在看来实在是可笑 ,不就是门技术吗,搞得生死离别一样,需要什么学什么不就行了,反正都会冲着全栈去的。想起《人月神话》里一句话:“没有银弹”。

然后学了几个月React,就跟着老师两个人做项目了,做完之后自己和同学捣鼓了一个笔记分享平台,之后又接了一个新的项目。这下导师让我和甲方接需求,设计原型,设计数据库表,系统设计前后端,也挺有挑战性的。

之后放寒假,这里还纠结了两个月考研的事情。然后就是奇幻 2020,遇上疫情,2 月初开始春招找实习了。

写到这里,再点缀些许感想:

  • 学会放弃:如果发现自己确实不适合做某件事,早点放弃,也需要一份勇气。对我而言,是否放弃一件事情,最关键的是,我做这件事是否感受到快乐,我是否真的喜欢这个。但是 ACM 集训的时候,对着一套套算法、一套套模板我真提不起劲,不合适,换方向!人工智能,深度学习,要钱要资源要导师,没有,换方向!Web 开发,是自己的菜了,自己喜欢前端,坚持下去!

  • 没有白做的事情:放弃了打 ACM,那段时间就一无所获吗?首先我意识到自己不适合走这条路,本身就是一种收获,最起码代码能力总增强了吧,思维能力也有锻炼,敲代码手速提升了不少;接触了深度学习,也让我在最后一个项目中直接用上了人脸识别;自学了JavaSpring框架,让我接触到了SOLID原则,设计模式等软件工程学知识,直接让我萌发了做架构的想法,让我更注重代码质量,系统设计,以及日后的维护性,伸缩性等,也让我在用Node做后端时,快速上手 expresskoa等 web 框架。更不用说这些东西对于我课程、绩点等等的帮助了,只要是软件开发课程,都是满绩。所以“白做”的这些事情,提升了我的知识广度。软件开发,总有一些东西是不变的,一通百通。

实习面试指南

个人觉得面试,除了一二三面这个角度,可以换一个角度来看,分别是简历关、能力关、表达关和潜力关。

简历关

  • 简介、美观
  • 挂上自己的GitHub博客
  • 项目要有能访问的线上地址

美观这个事情,也看人的,审美不同嘛,我个人直接用 typoraMarkDown,然后输出成 PDF,黑底白字,放几个蓝色的超链接。这个网上教程也很多,不赘述了。

GitHub 要多点绿啊,或者首页挂几个自己的得意之作,博客也更新几篇技术文章吧,技术文章完全原创有点难度,写一写自己学习下来的感悟也不错的,总之要体验出自己的持续热情

项目能访问,这个隐含的东西可多了。如果这个是你自己做的,这说明你起码舍得为技术花钱、会配置服务器、会部署前后端项目、有使用 linux 的经验、愿意证明项目是真的而不是嘴遁

技术关

基础:这个没啥好说的,刷面经,啃书,看别人的面试总结文章,你自己画一个思维导图来查漏补缺。

项目:项目要有难点吧,有的同学会问了:我没难点咋办啊,无中生有也可以嘛。虽然可能需求就那么多,但是你可以继续精益求精一点啊。比如很简单一个图片上传,可能你觉得行了,需求满足了,但是你在掘金随便一搜“上传”,一大堆业务需求就来了呀,什么大文件上传、断点续传、H5 上传、上传前预处理等等,随便一个都是常见的难点呀。

另外,既然是面试,就需要针对面试好好准备,即使平时水平很强,但是很多问题不专门花时间复习和总结,面试还是很容易翻车的,也会影响表达。

表达关

  • 礼貌、语速适中、表达清楚、主动交流
  • 基础和项目穿插,证明自己的知识整合能力

主动交流:不会就说不会,不要嗯嗯啊啊半天浪费时间,可以的话问一下“您可以给一些提示吗”。如果自己觉得有思路,但是一时半会不知道怎么说,就先说“可以给我半分钟思考一下吗”。

基础和项目穿插:问到基础可以穿插项目,这样才真实,而不是个只会背答案的复读•莫得感情•机。随便举个例子,比如问到状态码,你说“⋯⋯301 重定向,我之前做的一个项目地址改了,于是在 nginx 里配置的时候就用到了 ⋯⋯ 它和 302 也是有区别的,⋯⋯”。

潜力关

注意,面试官问你为什么选择前端、你在项目中的位置、你对 XXX(技术)的看法的这些问题,可能就是在考察你的潜力了。

这些问题我不想也不好给出什么答案或者套路,每个人情况都不同。建议结合自身经历提前准备一下。

学习指南

我总结的一句话就是,学习的路子要广,学完了要有总结和输出。

学习的路子要广

1 搜商

  • 搜问题:如果你只会用百度并且没有开去广告&&block 掉某些网站的话,那恭喜你你搜索到的东西很可能是二手甚至三手的资料,有内容错误 or 过时的问题,我承认很多东西都有存在的价值,但是这么做性价比太低。如果去试试在 Google、GitHub issue、掘金、知乎或者 V2EX 去搜搜看,性价比会更高,因为这些地方更专业。其次,Google搜索英文关键词,如果你看到Stack Overflow这个字眼,那么你离解决这个问题已经不远了。最后,试试工具—时间设置,保证自己搜到的东西比较新。
image-20200422103849132
image-20200422103849132
  • 搜学习资料:很多人要开始学一个东西,但是不知道怎么去搜罗好一些的资料。其实写的好的官方文档就是很好的资料,你可以试试在GitHub搜索,知乎搜索、B 站搜索、微信搜索以及淘宝搜索。我个人喜欢官方文档、YouTube、Google、国内各种论坛、GitHub、B 站这个顺序来找资料学。互联网这么发达,资料实在是太多了,每个人的习惯也不一样,参考参考就好。
  • 搜项目:推荐 GitHub,学会关键字搜索和条件设置!
  • 学习路线图 roadmap + 技术
  • 优质项目列表 awesome + 技术
  • 不错的项目模板 realworld + 技术
  • 条件设置:指定 stars language forks 等等

其次,国外也有很多好的论坛,比如 Medium;YouTube 也有很多conf可以看,还有超多的入门教程,用英文关键词搜索就行。

另外要注意的是,掌握了正确的搜索姿势,却也不要搜上瘾了,找到了不错的、比较新的资料,就可以开始学习了,不要一直想着再搜搜看有没有更好的,这样永远不会开始学了,收藏夹里资料倒是一大堆。

2 看书

前端开发的书单不赘述,知乎豆瓣掘金都有很多推荐。

我们做前端开发工程师,除开前端开发,首先是工程师。我不想只是搬 🧱 的,平时会看一点别的书。

  • 好的代码:《代码整洁之道》《架构整洁之道》etc
  • 项目管理:《人月神话》(很多地方没看懂,工作后再看看可能会有新收获)
  • 设计:UI 设计《写给大家看的设计书》产品设计推荐人人都是产品经理这个网站
  • 素养:《程序员修炼之道》《程序员的职业素养》

还有其他的好书,可以评论区推荐一下哈。

3 技术广度和深度

第一层:学完一个技术,能做个“调包侠”,做出来的东西能跑,满足基本业务需求;

第二层:要求自己去学习所谓“最佳实践”,能写出高质量、高性能、可维护的代码;

第三层:打入底层,了解原理,能做优化;

第四层:不仅能做好细节,而且能做系统总体架构的设计,这对知识广度和深度都有很高要求。

4 工具

这里碎碎念说几个点:

我们每天吃饭的工具—PC,win/macOS 熟练否;

编辑器:快捷键、各种提升效率的插件、代码检查、格式化等等;

linux 常见的几个命令;

版本控制 git、以及 GitHub 熟不熟练;

chrome 的调试技巧、性能检测工具、好用的拓展工具;

还有 postman / navicat 等等好用的工具,这些东西会极大提升我们的工作效率。

做总结和输出

学习和遗忘作斗争,忘记是正常的,所以我们需要记录下来备查。

另外,学习效率金字塔告诉我们,能像老师一样教授给他人是效率最高的方式,也就是做输出。下面给两个可操作的方式。

  • 写博客 or 整理文档github pages了解一下,自己买ECS+玉名(敏感词)也可以,可以搭配 hexovuepress或者其他的,vuepress适合整理大量的文档,比如面试题等等。当然技术不重要,关键是要写,博客做的再好看不写也是白搭。
  • 费曼学习法:假设有一个初学者,你要把这个技术给他讲明白。个人认为,这个技巧最妙的部分在于,讲的过程中你不得不联系到其他的、对方可能可以理解的其他知识点来辅助你,整个过程就像是 BFS&&DFS,会迫使你去构建一个“知识图谱”。我用这个方法很久了,屡试不爽。再者,面试之前多练练,有助于提升“嘴感”。

尾声

学习这件事和这两年的经历,其实远不是短短几千字可以写完的东西。单是搜索效率那一块就还有很多东西可以写的。

这篇文章的目的还是总结自己的面经,分享学习经历,能帮助到大家一点点笔者就很满足了。自己也会不定期将写一些原创文章,可以关注一下。

收拾行囊,继续出发。