0%

前端两年半面经流水账

背景

先简单介绍下本人的情况,2017年毕业于福州大学,然后在厦门一家 CDN 公司任职前端开发工程师,大概2年半的前端开发经验。

接触过后端移动端,目前主方向是前端。参与的项目基本都是 toB ,主要分为流媒体,可视化,前端优化,portal平台等几个方向。

在开源项目方面,实现了一个基于 antd3 的前端长列表相关组件库(现在已不维护,可直接使用 antd4

最近在研究的技术有:webassembly,webgl

废话不多说,下面进入正题 ~

面试总结与建议

先说这个,比较重要。

19年底的几个面试没做好准备,对自己过于自信,直接拿大厂刷面经,现在想想是真的蠢。。

建议大家先找朋友帮忙面试,然后可以先投一些不会去的厂刷刷经验。

由于大厂的面试流程比较久,如果有流程较快的备胎公司的话,建议在大厂面试的末尾阶段再投,否则多个 hr 催着给答复很难受。

技术面的话,大部分问题网上都可以找到,不过有些面试官会层层递进,背的还是理解的一试就知道

然后要注意非技术题目也很重要,需要好好准备,包括且不限于:

  • 自我介绍(hr版本和技面版本)
  • 离职原因
  • 未来规划
  • 为什么你希望来我们公司工作?
  • 你希望通过这份工作获得什么?
  • 说说优缺点,用几个词描述自己
  • 还有什么其他问题
  • 为什么选择前端
  • 平时的学习方式
  • 和原同事的比较
  • 项目开发流程,管理流程

有几个大厂就是因为非技术问题没有准备,回答的时候表述很乱,最终综合下挂了。。

js 手写题和算法题的话可以参考这个项目,这是我做过的题的一些记录

由于疫情原因中间停了一段时间没有面试,加上等待 offer 的时间,从开始面试到最终确认 offer 前后也经历了三个月的时间。庆幸的是,最后拿到了满意的 offer。

下面就以面试的顺序来进行描述,面试时没有录音,题目都是事后进行回忆,写的不全,有些重复的题目可能不再记录。

阿里-供应链平台

面试阿里的契机是有个大佬通过博客找到了我的邮箱,说帮我内推,正好准备找工作,于是就开始了面试之旅,其实那时候还没准备好。。

一面 19/12/16

  • 讲一个最有难度的项目

    • 追问:有哪些功能,负责什么模块
    • 追问:做了哪些体验优化
    • 追问:pv 多少
    • 追问:首屏加载时长
  • vue 和 react 的区别

    考察的是原理上的不同,千万不要讲用法。核心区别是数据更新触发页面重渲染的方式不一样。vue 采用的是数据拦截和依赖追踪,数据变化就会触发相应的更新;react 通过api去变更数据并进行局部更新,因为对数据变化无感知,因此可能需要对子组件也进行 render,不然子组件不知道是否应该重新render

  • 虚拟dom用来解决什么问题,性能和设计两方面回答

    其实面试官想考察的是组件和底层元素的抽离这点,性能的话看业务代码不一定虚拟 dom 就比较优

  • react hooks 解决了什么问题

    状态逻辑难以复用;生命周期中的逻辑代码难以维护;this 指向问题

  • 讲讲 vue 原理

    模板解析,响应式,渲染

    • 追问:模板解析过程,核心是什么

      当时没理解问题要问什么,我猜应该是要问 vdom->diff->patch

  • 从输入 url 到页面渲染的过程

    参看 从输入url后浏览器发生了什么

    • 追问:哪些地方可以做优化,做个归类
  • csrf

  • settimeout ,promise,async/await 区别

    宏任务,微任务,协程

    • 追问:事件循环有哪些任务源

      网络,定时器,history,用户交互事件,DOM manipulation

    • 追问:以什么优先级取任务源

      3/4概率拿交互任务源,避免交互堵塞

  • 后端项目,用的什么框架

    • express 的中间件原理

      本质就是回调队列,next 执行

    • egg

二面 19/12/26

  • 项目和业务的相关问题
  • 两道 js 手写题

可能是项目经历和技能与岗位要求不匹配,在 28 号收到了拒信,简历进入了人才池..

字节-今日头条

头条是没做好准备就去面的,结果很差

一面 19/12/23

  • 聊项目
  • vue/react 的相关问题
  • 【笔试】写个继承
  • 讲讲原型链

    参看 重学 JS 原型链

  • 讲讲模块化
  • webpack 中 loader 和 plugin 的区别
  • class 的 super 做了什么

美团-企平

一面 19/12/26

  • 基本是讲项目
  • 同域请求的并发数限制的原因

    线程切换损耗,端口占用限制

  • vuex 解决什么问题
  • cdn 加速原理
  • 组内开发流程,如何提高代码质量

二面 19/12/17

  • js 内存模型
  • 讲讲闭包
  • 讲讲原型链
  • 讲讲变量提升
  • vue 和 react 的区别
  • http2 的特点
  • https 原理
  • 讲讲缓存
  • 讲讲双向绑定
  • 讲讲js的线程
  • 开放题:js 是一门面向对象的语言么?
  • 讲讲项目中用到的设计模式
  • 最近关注的新技术
  • 项目上的问题
  • 【笔试】转驼峰

shopee

一开始以为是小公司,想拿来刷面经,后面才发现这个公司挺不错的。

本次面试应该是最后一次没有准备的面试

一面 2020/12/30

  • 【笔试】模拟 instanceOf
  • 讲讲原型
  • 讲讲中间人攻击

ringcenter

先做了几道笔试题,主要考虑 es6语法和代码风格,我面试的部门听说只有一轮技术面,所以前后聊了快两个小时

一面 2020/1/2

  • react 相关问题
  • css 基线
  • css 盒模型 嵌套块元素最终 marginTop 的值
  • vue 和 react 的比较
  • https 仅用非对称加密的可行性
  • 词法环境
  • 事件循环,回调由哪个线程处理
  • 编程习惯相关
  • 代码性能相关

css 没怎么准备,回答错了,最后挂掉

阿里-政务中台

换了一个部门投递,不过部门之间是会交流的。不要以为前一个部门挂掉对下一个部门没有影响。。

不过好像前一个部门对我的评价还行

一面 2020/1/3

  • 某个列表组件有大量 dom 节点,如何优化
  • 虚拟 dom
  • 301 和 302 的使用场景

笔试 2020/1/7

做了三道笔试题:去重,模拟 render,继承

二面 2020/1/8

  • 主要是问项目
  • 状态码
  • PUT 和 POST 的区别

    幂等性

最后聊天的时候,面试官说已经认可我的技术了,让我好好准备后面的面试,另外让我注意下表示方式和技巧。那时候还以为稳了。。

三面 2020/1/16

  • 技术成长相关
  • 和其他同事的比较
  • 学习和工作
  • 如何学习
  • 形容自己

应该是平台的负责人面试,都是非技术性问题,有些题目没有准备结果回答的很差。。

交叉面 2020/1/17

隔天就收到了四面的通知,如果这面过了应该就稳了。。

结果上来就是 react 相关问题, 由于我 react 了解的不是那么深入,很多回答不上来,我只好对面试官自己熟悉的 vue ,希望往 vue 方面靠。后面面试官就没有继续问了,主要聊项目这块。

面试完之后感觉凉了,由于没有收到拒信,但是内心又存在着一点小希望。

后面就是过年了,boss 上问内推的那个人也没有回复,直到2月初又有新的部门从简历池把我捞起来,我才知道挂了。

这里建议可以加一下面试官的微信(如果对方同意的话),可以了解反馈,交个朋友

美团民宿

一面 2020/1/7

  • 项目相关
  • 【笔试】找到字符串中出现次数最多的字母
  • java 怎么实现单例

    饿汉,懒汉

  • 为什么 js 中没有单例

    单线程

美团民宿 二面 2020/1/7

技术成长方面

在“为什么离职”这个问题上走远了。。

腾讯文档

一面 2020/1/9

  • 服务端渲染原理
  • 【笔试题】26进制

    实现26进制

  • http 协议
  • chrome 开久了卡顿的原因

笔试题没有完美写出来,加之之前没准备面试的另一个部门对我的评价较差,综合下挂掉了。
再次提示,其他部门的面试反馈会影响本部门的面试成绩。

年前阶段总结

年前的面试大概就是这样,很惨,一个 offer 都没有。

所以建议做好准备再开始面试

受疫情影响,在家里呆了一个月。那时候疫情比较恐怖,打算直接找厦门的公司了

亿联

一面 2020/2/25

  • 数据结构: hash 表(红黑树,扩容,hash算法),LinkedList
  • vue 和 react 在 dom diff 上的差别
  • v8 的分代垃圾回收

二面 2020/2/26

  • 后端数据太大,长列表白屏较久如何解决

    防抖+loading

字节跳动-西瓜视频

发现字节在厦门也有团队,于是拜托了学弟帮我内推,整个过程还是比较顺利的

一、二面 2020/2/26

  • 同源策略,为什么会有跨域限制?
  • 【笔试】fetch 增加超时功能
  • 【笔试】非递归二叉树前序遍历
  • 【笔试】取值 1~100 的元素,进行排序(计数排序&快排)
  • 大数据的图表优化

两个面试是一起的,总共大概2个多小时,后面能记住的题目也不多了。

三面 2020/3/3

先是问了之前面头条为什么会挂,然后把一些问题重问了一遍

  • react 批量更新原理
  • react fiber
  • react hooks
  • vue3 的改进
  • websocket 协议,轮询,长连接
  • canvas,svg 对比,canvas 转图片,canvas 污染
  • 流媒体相关
  • JSBridge
  • h5 开发相关

最后

天道酬勤,与君共勉~

希望本文能给您带来一点点帮助

您的支持将鼓励我继续创作!