2019年12月前端面经及总结(西安,杭州)

示例代码托管在：http://www.github.comhttps://img.qb5200.com/download-x/dashnowords/blogs

博客园地址：《大史住在大前端》原创博文目录

华为云社区地址：【你要的前端打怪升级指南】

从2019年12月初陆陆续续面到过年，有一些也没面完，结果遇上病毒疫情，整个招聘进程貌似都搁浅了。自己的情况是本科学历，学校还不错，所以虽然前东家是外包公司，但大部分简历初选能过。入行两年半第一次换工作，整体经历约40天，身心俱疲，踩坑无数，将经验教训分享给大家，祝各位疫情过去后拿到心仪的Offer！

题目只是帮助大家查漏补缺梳理知识点，请不要抱着押题的心态，真的没用，每一家甚至每个项目组感兴趣的点都不一样，面试玩法也不一样。

一.面试题汇总

蚂蚁金服（杭州）

• 一面
  1. 项目有关的细节，遇到的问题和解决的办法
  2. 三大框架如何选择
  3. 从RenderLayer层面讲讲代码性能优化实践的底层原理(当时那段时间在研究，自己博客里有写，主要是考浏览器渲染管线)
  4. CSS动画和Js动画的区别
  5. 讲讲对函数式编程的理解
  6. 页面发了个请求，请求没返回用户就切去另一个页面了，这会有什么影响，怎么处理？fetch请求怎么取消？
  7. 描述了一个输入框输字母就触发请求的场景，问怎么解决(其实就是问debounce去抖和throttle节流)
  8. 讲讲ES6的Reflect特性
  9. 讲讲Promise和Rxjs的区别
  10. switchMap运算符是做什么的
  11. 如何实现一个全局单例(答工厂模式，又问工厂模式和全局直接挂载对象有什么区别，当时没想到，工厂模式是第一次用时才生成实例的)
  12. 自己前一个项目做Vscode插件开发，宽泛地聊了一下。

思特沃克（西安）

• 一面

  实战coding ，一个需求开发任务书，不能使用任何SPA框架，开卷手写代码，2-3天提交，有设计稿和关键尺寸，属于开放题。

有赞（杭州）

• 一面

  1. Vue里数组是怎么实现响应式的

  2. vue计算属性原理和特点，问怎么实现的缓存避免重复计算的(卡壳了，我说是computedWatcher被通知更新时可能可以查看依赖，后来面试官告诉我是依赖时候更新时会修改标记位，响应式的重点是【被动】)
  3. 箭头函数的特点，适用场景和不适用场景(适用的场景我说原来需要保存外层this时现在可以穿透调用，不适用的我说比如定义原型方法时容易用错使得this提前绑定到外部词法作用域，让我举个具体例子，一时没反应过来这个问题的点是啥，就说想不出来)
  4. this的是如何确定指向的
  5. call，apply, bind的区别
  6. bind怎么实现call
  7. Promise是怎么实现的

  8. Promise.all要怎么实现

• 二面

  1. 在线编程两个代码题
  2. 询问项目经历，针对项目问细节
  3. Nodejs部署和运维相关
  4. VirtualDOM相关
  5. 递归中划线转驼峰

微创软件（杭州）

• 一面

  vue和react区别
  vue双向绑定原理
  virtualDOM有什么好处
  vue组件怎么传值
  vuex的数据流
  vue的生命周期有哪些
  浏览器渲染流程
  DOM解析遇到script标签会怎样
  js操作DOM和修改css时如何注意性能
  跨域方案
  Cookie可以带哪些属性
  map和set的区别
  身份令牌Token一般怎么生成

• 二面

  VUE双向绑定原理
  eventloop原理
  原型链原理

网易（杭州）

• 一面

  webpack流程
  如何优化webpack打包结果
  写没写过webpack-plugin，什么场景下写的
  babel是怎么把ES6转成对应浏览器里的ES5的
  CSS动画有哪些属性
  CSS伪类
  纯CSS怎么实现评分框组件（考察同级选择器）
  nodejs常用的包和API有哪些
  nodejs往前台传大文件怎么传
  物理像素和逻辑像素的区别
  Http协议和HTTP2
  TCP协议，TCP为什么可靠
  TCP里哪些在http里没实现
  前端的缓存控制有哪些
  CSS里各种尺寸单位是怎么算的

• 二面

  项目和项目相关
  在线编程题：写个带过期的localstorage
  针对写的代码问哪里能优化和边界情况
  再回到项目一直问细节

• 三面

  在线编程题：写一个异步并发控制
  问工作履历
  问出于什么目的写技术博客
  原来组里项目上线流程是什么样子
  浏览器输入url发生什么
  一个http请求一定对应一个tcp连接吗？
  关于http2都了解什么

政采云（杭州）

• 一面:
  细问项目
  如何做团队内训
  如何把控代码质量
  浏览器输入url后发生什么

• 二面：

  Vue组件现场设计，讲思路即可

  其他问关于项目和项目细节

滴滴（杭州）

• 一面：

  介绍项目，针对项目问
  React的setState是同步还是异步
  immutable.js和pureComponent有什么关系
  vue响应式的原理
  webpack现在有100个入口，编了5分钟怎么办
  101状态码是什么意思
  302和304分别表示什么
  E-tag是怎么生成的
  asynchttps://img.qb5200.com/download-x/defer的区别
  css三角形怎么画
  输入url到渲染都发生什么
  对机器学习是怎么理解的
  node用什么框架怎么部署怎么监控怎么保活
  最近的新技术都了解哪些
  对前端未来的趋势怎么看

• 二面

  针对项目提问
  webpack细节，很多很多细节
  webpack-loader的查找路径
  elementUI怎么做到组件按需加载

• 三面

  针对项目和软技能，感觉主要想了解在原来团队扮演什么角色，做了哪些贡献

• 四面

  项目经历，软技能考察，技术问的少

字节跳动（杭州）

• 一面

  编程题：写一个检测循环引用的代码
  编程题：写一个函数节流的
  web性能优化的方法有哪些
  首屏优化的方法有哪些
  浏览器端缓存有哪些
  no-cache和no-store区别
  浏览器端怎么开线程，nodejs端怎么开线程
  浏览器端多线程有哪些种类，具体用到哪个API
  关于BFC
  针对项目简单问

• 二面

  针对项目简单问了问
  span设置padding是否有效，横向是否有效，设置宽高是否有效
  inline-block空白节点产生原因，怎么消除
  要在浏览器里捕获尽可能多的错误类型，一个非侵入式的库怎么实现
  nodejs错误上报怎么报
  webpack懒加载模块怎么实现，如果加载没成功怎么上报
  vue/react框架里如果有错误怎么上报
  跨域怎么产生，追问CORS头设置，追问跨域时身份认证信息怎么携带
  原生fetch 原生ajax请求怎么实现对错误响应码的判断，手写错误拦截代理
  垂直水平居中怎么实现
  BFC有哪些触发条件，有哪些现象，追问的非常细
  https的过程，问得非常非常细（网上看的那种通俗讲解都顶不住问）
  前端性能优化怎么做，没追问
  React Fiber结构对比stack优势是什么，为什么可以打断

没通过，换投了另一个组：

• 一面

  从头到尾问nodejs运维，即便自己强调原来在项目里是怎么用nodejs的，说运维这一块接触的比较少，也没用，面试官还是很嗨地一直问运维。

阿里-达摩院前端岗位（杭州）

• 一面

  讲项目，针对一些点让细讲
  generator函数
  哪些类没有迭代器接口，如果要增加怎么加
  React生命周期有哪些，新的生命周期为什么要做这样的变化
  three.js做过哪些项目，问API和基本原理
  全景3D怎么实现
  3D的镜头切换动画怎么实现
  浏览器输入url发生什么

• 二面

  询问项目相关
  做过最有挑战的项目
  最近在读什么书
  面向对象编程的原则
  React dom-diff时间复杂度和原因
  10万的数组取最大的前100怎么取
  一些有关软技能的问题

• 三面

  项目细节相关
  大量canvas底层API
  现场抛一些需求，讲实现思路
  对前端智能化的理解
  对React新特性了解哪些
  React Hooks的作用和基本知识

饿了么-图形学方向（杭州）

• 一面

  canvas基础知识
  webgl可编程渲染管线基础知识
  做过哪些3D项目，承担了哪些工作
  10000个立方体用three.js建模如何保证性能
  二维和三维常见的碰撞检测怎么做
  三维空间坐标怎么转换成屏幕上的二维坐标

• 二面

  项目经历，询问各类细节
  个人技术发展的倾向
  canvas和svg的特点和选择
  js里浮点类型有什么缺陷
  关于图形学的应用场景和前景的看法

  然后过年了，三面面试官时间排不开，搁浅了。

腾讯（西安）

• 一面

  问项目经历，偏广度，深度不算难
  检验邮箱地址的正则
  typescript有哪些定义类型的方法
  对ts的看法
  原生方法实现字符串逆序
  node.js做过哪些相关的项目
  canvas和svg的特点和选择

• 二面

  问项目经历
  ts中变量定义有哪些方法，区别是什么
  关于前端性能优化都做过哪些相关工作
  讲讲http2的特点
  http2为什么没有解决队头阻塞问题
  业界对于队头阻塞是否有解决方案
  TCP快速重传的尝试次数和间隔时间
  100张牌，两个人轮流取，能否让自己取到最后一张

• 三面

  自己技术方面的特点
  做过的最有挑战的项目
  个人职业发展规划
  前端性能优化方面的项目经历

三面完收到短信说进入下一环节，然后过年了。

二. 面试心得及建议

1. 认真准备，你会和面试中你能讲清楚完全是两码事，不是为了背知识点出去吹牛逼，而是把自己会的梳理好思路，组织好语言，哪怕几个月前才做过的项目，如果没有做项目复盘，突然让你讲，恐怕未必所有细节都能记得清楚。
2. 每面完一家一定要反思，总结，把没表达好的地方再打磨打磨，一些高频问题的答案组织好提纲，尤其是关于项目的，现想的通常逻辑都会很混乱，笔者自己面到最最后，依然感觉很难把项目说出亮点来，毕竟前东家是外包公司，很多点没机会做得深入。
3. 简历不是一成不变的，最好提前找大佬帮忙看一看，排查一下暗坑，然后基本每面一家都会再调整一下细节，有些项目经历是事实，但是如果回答不出深度建议还是不要写，比较心仪的岗位需要根据岗位描述有偏向性地单独准备简历。一些说辞一定要想好，最好提前跟HR沟通一下。笔者自己在前期的面试中项目经历上总是讲的磕磕绊绊没什么亮点，对方感觉也没什么可问的，后来在一些面试中就尝试把话题引到一些自己业余时间在外面参加的项目上，因为用的技术比较新，相对而言有一些谈资，可聊的点比较多，也比较能凸显综合能力，这个时候就一定要注意了，面试官对这种事态度是千差万别的，有的就会继续针对技术细节问，有的会问你如何保证业余项目不影响正式工作，也有的会一棒子把你打死，笔者在某大厂终面时，就被面试官粗暴打断，一口咬定你这就是接私活做外包，肯定会影响公司的工作，然后一通训斥后就终止了面试，完全没有解释余地，有点冤但也没办法，所以敏感话题一定要慎重，尽量从工作里项目本身挖掘亮点，万不得已时要有承担必要风险的心理准备。
4. 不要把内推想的太神奇，除非是够硬的关系。对大部分人而言，内推的作用就是过简历关，其他方面的作用不太好评估，你拿Offer了，内推人拿推荐奖金，你面挂了，推荐人也不会怎么样，打铁还需自身硬，当然这只是自己的看法。
5. 控制自己的面试节奏，否则可能会非常辛苦。每个公司的面试节奏不一样，可以提前找HR问清楚，比如阿里就是平均一个岗位要面一个月，而滴滴我当时早晨一面下午二面，2天后就三面了，进度很快。笔者面试中节奏安排基本是错乱的，中间有几天平均每天1.5个电话面，真的很考验体能。建议综合调研一下可以投的岗位，按照【保底】【满意】【挑战】三个档拉开梯度投简历，毕竟你最后只能选一个，都投到一个档次里意义不大。网上那些拿到各个大厂Offer的大佬，可能是真的非常牛逼，也可能是面的岗位并没有拉开档次，笔者个人觉得对于大部分中等水平的面试者而言最终能有1-2个心仪的Offer才算是规划的比较好，拿得多只是说起来比较好听，如何取舍那就看自己了。
6. 招聘软件上会有很多人问你要简历，他们并不是真的对你感兴趣，只是群发消息，建议不要随便给简历，很吓人的。笔者自己第一个蚂蚁金服的面试，就是招聘软件里对方说“先看一下简历”，结果转手就给内推了，当时没有经验，完全不知道面的什么部门什么要求，也不知道面试预约了还可以推掉，结果赶鸭子上架第一个面试一面就栽了，面评表上吃了个很难看的差评，很影响心情。
7. 不要把人想的太坏，也不要把人想的太好，想让你过的会帮你找亮点，让你有阐述的机会，不想让你过的就会盯着你不会的点一直问，随时等着放大你任何一个漏洞，面试的过程中你会遇到各种各样的人，当成一种阅历，不卑不亢就好。给我印象比较深刻的是政采云的技面官，花名堂主，面试之余给了我很多忠告和指点，受益匪浅。
8. 不要话太多，每个面试官喜好不同，有的人希望你不知道的就说不知道，有的人希望听你的思路和推测，我自己在面试中，有的面试官就说“不知道没关系，你可以讲讲思路，或者如果让你来做，你会怎么做”，也有的面试官开场就说“我问的每个点你简单陈述就行，如果我感兴趣就会自己展开问”，在不明确对方偏好的情况下，建议话少点，说的越多漏洞越多，也容易碰到雷区引起反感。
9. 简历尽量投给HR和你认识的搞技术的朋友，这样即便最终没有通过，也大概能知道问题出在哪，原则上面评结果是保密的，但是可以拜托对方针对自己的不足点提供一些关键信息，以便明确下一步努力的方向，面试从来都不是一次决定最终结果的活动，一次栽了，再面其他的就行，如果真的非常向往某个公司或岗位，过一两年再来就行了，重点是你要先敢面。如果简历给到猎头，那么当你面对同等资历的竞争者时可能就会被Pass，因为如果招了你，是需要给猎头付费的，如果简历给了不认识的人内推，极有可能后续什么消息都打听不到，干着急。
10. 我强烈建议大家去尝试参加面试，去了解大厂的技术动向和对于你这个水平的面试者的评定条件，每个厂都不一样，你的学校、专业技术、工作履历、工作年限、项目管理经验等等都可能被作为指标，尤其是像笔者这种半路出家的野路子码农，千万不要用网上那些经验往自己身上套，差别太大了。很多人都会觉得自己“水平差”，感觉自己“啥都不会”，但是自己感觉自己差和面试中被人吊打完全是两种感觉，后者虽然不好受，但能迫使你做出改变，走出舒适区。
11. 面试是一场匹配游戏，不是你越牛逼结果就越理想，关键词是【匹配】。大多数面试者都是劣势的一方，请对自己好点，通过了，告诉自己"运气不错，继续努力，要对得起别人的赏识"，没过，也没关系，告诉自己"运气不太好，继续努力就好，总有一天会有人赏识"。对面试中暴露出的技能短板要足够重视，但对于结果，真的没必要太较真，有时候公司的想法并没有那么复杂，就是想招个更年轻更便宜的而已。
12. 工作年限和年龄真的是很重要的考量因素，不管招聘方承不承认。
13. 项目经历是一定会问的，建议写自己能讲的稍微深入点的，而不只是罗列工作内容，项目经历一定程度上会对面试官的提问范围有导向性，一定要认真考虑。笔者最初写的期望职位是“资深前端开发或前端架构师”，项目经历就写的工作中的项目，主要涉及研发效能工具和Devops及数据可视化相关的一些开发，但发现经常会栽在面试官问的关于Nodejs的运维和中后台知识上，有的甚至问Linux相关的，而这些都是自己的薄弱项，很难展开来聊的深入，毕竟工作里并没有太多机会接触，而更多地是用Nodejs来做效能工具；后来将期望的职位修改为“可视化工程师或图形学工程师”后，在简历上罗列了一些自己工作以外亲身参与的项目，面试中在面对关于2D可视化的库，3D图形学的库、图形学基本知识、WebGL的知识、性能优化和项目经历时就感觉游刃有余，当然也因为自己确实经历过这些。
14. 一定要有亮点！！无论是什么，一定得有跟普通应聘者不一样的地方，可能是业务梳理能力，资源协调能力，跨端开发，跨栈开发，或者某个专项的技术玩的很溜都可以，但一定得有，如果还没有，那就开始培养一个。

三. 终于有时间写的2019年小结

2019年依旧是奋斗的一年，在2018年的总结里写到2019年想研究Nodejs和图形学方向入门，其实完成的还不错，输出Nodejs专项的博文10篇，canvas的2D和3D图形学博文15篇（我的博客地址，欢迎互粉http://www.github.comhttps://img.qb5200.com/download-x/dashnowords/blogs），算是入了门了。公司的工作中基本保持着B+和A的绩效，也拿到了业务线Top40工程师的荣誉，算是不错的收获，比较有成就感的事情是参加了GDGXi'an开发者社区11月份举办的开发者交流活动，参加闪电演讲分享了一些关于浏览器工作原理的知识(【闪电演讲-假如我是一个浏览器】——B站链接)，获得了很多认可，也认识了很多优秀的小伙伴和西安本地的大佬。

但由于作死本能的影响，12月初时开始了一段为期2个月的“花式作死面试历程”，上一次面试还是2年半以前，西安前端方向的大厂很少，所以这一波主要以杭州的前端岗位为主。大厂面试绝对是一场旷日持久的身心灵的考验，尤其是对于以前没怎么系统梳理过前端知识点的人而言，各种查漏补缺，各种复习完就忘，很容易崩溃，条件允许的话建议还是报班，周期拉长一些会比较好。即便19年年初时就确定了今年主攻的nodejs和图形学方向，也有一些进步，但还是在面试时被吊打，只靠自己进步速度还是太慢了，所以就选择了离职并换一个环境，至少自己还有改变的勇气。当然凡事都有好的一面，那就是一大波面试过后，自己和目标之间到底差了些什么就相对比较清楚了，在哪里跌倒就在哪里爬起来，新的一年，干就完了！