前端面试总结

最近换工作,面试了几家大厂(阿里、网易、依图科技、美团、新H3C、丁香园、每科等),有的拿到了offer,有的则是被当作备胎,也有的没有走到终面。鄙人工作快6年,所以对标岗位都是高级或资深,现将面试总结记录如下:

一面:

主要是考察技术的广度,适当的考察知识点的深度。这一面不一定是按照简历上的技术点来发问。面试官都会由浅入深地盘问。

  • 自我介绍

介绍自己的亮点(可以是大厂工作经历、工作经验、较为复杂的项目经历;清楚描述自己的工作内容,突出自己的地位;可以结合项目来聊,展示正能量)
例如:
我叫XXX,xx年毕业于xx大学,毕业之后就一直做前端开发相关工作,距今有xx年的工作经验。最近一家公司是xxx,工作角色是xxx,主要负责项目的前端技术选型、项目结构搭建、开发,项目前期也会一起参与需求评审。最近做的项目叫做xxx,前端技术栈nodejs(中间层)+vue(视图层)+webpack/gulp(项目构建和优化)。业余时间喜欢逛知乎、掘金、segmentfault等网站

  • 技术问题
    • 什么是栅格?有什么用?怎么用?有没有自己设计过?
    • 只用CSS如何实现单行文本溢出效果?多行文本溢出效果呢?
    • CommonJS规范中的require和ESM规范中的import有什么区别?
    • 说说CommonJS、AMD\CMD、ESM的区别?
    • 能说说什么是MVVM吗?每个字母分别代表什么含义?自己有实现过MVVM吗?主流的MVVM框架有哪些,它们的实现原理有没有了解过?
    • 说说vue和react的区别?
    • 有没有看过vue源码?能说说双向绑定是如何实现的吗?
    • vue中watch和computed的区别是什么?computed和watch的实现原理是什么?
    • 项目中vue组件间是如何通信的?
    • 能说说vue组件的生命周期吗?
    • vue2中vdom有了解吗?有什么用?vue2中为什么要引入vdom?
    • vue2中vdom的diff算法是怎么实现的?
    • vue2中$nextTick有什么用?在什么场景下适合用到?它和setTimeout/setImediate的区别是什么?
    • 用一句话概况为什么选择vue(react)而不用react(vue)?
    • 对react是否熟悉?能说说组件有哪几种吗?为什么会有这么多种?
    • redux中的reducer有什么用?
    • 项目中有没有用到webpack?怎么用的,帮你解决了什么问题?
    • 说说你们项目中使用到的webpack的loader有哪些?为什么要用这些loader呢?
    • 说说webpack的tree-shake是什么?用于解决什么问题?
    • 说说webpack的caching机制是什么?为什么会有caching?
    • 说说webpack的runtime是什么?有什么用?
    • 有看过webpack的源代码吗?有自己写过webpack的插件吗?说说webpack的工作原理?
    • 说说webpack配置文件主要都有哪些常用配置项?每个配置项的作用是什么?
    • 说说webpack的bundle、chunk、module的区别吗?
    • 项目中是否用到gulp?能否手写一个gulp任务实现文件复制功能?
    • 前端代码有用到ES6/7/8吗?如何保证他们在IE上正常运行?
    • 是否用过babel?有什么用?如何用?babel的原理是什么?
    • 什么是CSS模块化?有什么用?如何用?
    • 现在有一段文本,需要做首行缩进效果,需要用到哪个css属性?用什么单位比较合适?
    • 段落文字之间的左右间距怎么控制?
    • margin和padding可以为负数吗?margin为负数用在什么场景下?
    • hasLayout属性有什么用?
    • position有哪些值?(考虑CSS3中新增的)
    • 什么是圣杯布局和双飞翼布局?如何实现?
    • 是否了解em/rem/px的区别?使用rem的时候有没有遇到什么坑?
    • 有没有做过移动端开发?移动端开发如何适应各种屏幕?
    • 微信小程序端有做过吗?说说微信小程序开发中有什么坑?
    • 什么是CSRF?如何防御?
    • 说说http缓存策略有哪些?如何实现协商缓存呢?
    • 是否了解http2?能简单说下它的新特性吗?
    • 如何实现util.promisify()方法?
    • 项目中有用到nodejs吗?帮你们做了哪些事情?你觉得用nodejs来做这些事情合适吗?
    • 说说对于这句代码,JS引擎做了哪些事情let obj = new Person();
    • proto和prototype的区别是什么?
    • 说说nodejs的异步IO指的是什么?什么又是事件驱动?nodejs异步队列有哪些?
    • 说说浏览器端事件循环和nodejs端事件循环的区别?
    • 说说未来的职业规划?
    • 说说你过去项目中自己觉得最亮眼的点/你做过最得意的项目是什么?

二面:

面试官会先自我介绍,然后轮到面试者自我介绍。这一轮继续考察技术的广度和深度,面试官会结合简历上写的技术点来发问。(某些厂会有笔试)

  • 什么是BFC?有什么用?如何触发BFC?(相关概念:IFC、FFC、清除浮动、margin collapse)
  • 说说web缓存分为哪两大类?http缓存是什么?浏览器缓存是什么?
  • 使用ES6语法一行代码如何实现数组去重?
  • 解释一下盒子模型宽高值得计算方式?box-sizing有什么用?
  • fetch和ajax的区别是什么?fetch有什么坑吗?
  • 知道margin collapse吗?如何解决?
  • 块级元素和行级元素有什么区别?行级元素有哪些?行级元素能设置宽高值吗,举个例子?行级元素设置display:inline-block之后为什么宽高会起效?
  • 说说JS中逗号运算符的作用?
  • 浏览器中输入一个url,按下Enter键后会发生什么?(尽量说的完整)
  • 说说什么是JS闭包、原型、原型链、作用域、作用域链?
  • 页面DOM节点太多会出现什么问题?
  • 如何获取元素到视图顶部的距离?
  • getBoundingClientRect中获取的top和offsetTop中获取的top有什么区别?
  • 浏览器端setTimeout有什么坑吗?
  • setTimeout和requestAnimationFrame有什么区别?
  • defineProperty属于ES6吗?它和Proxy有什么区别?
  • 说说ES6中都有哪些新特性?
  • vue中数组如何更新值?有什么性能问题吗?如何实现只更改数组中的某一项(从性能方面考虑)?
  • JSONP原理是什么?CORS是怎么执行的?
  • MessageChannel和postMessage各有什么用?
  • setTimeout和Promise.then的执行顺序有了解吗?在浏览器环境下和nodejs环境下各是如何?
  • 说说web安全性方面的认识?项目中是如何做的?
  • 说说单点登录流程的实现逻辑?
  • 项目开发中有没有遇到什么技术问题?说说解决的过程?
  • 介绍一下自己感觉最有挑战性的项目(可以从这几个方面入手:项目性质、项目规模、项目架构、自己承担的工作、项目亮点、项目难点、性能优化)
  • 你有什么要问我的?(本轮面试的表现怎么样?你们常用的技术栈是哪些?)
  • 说说TCP三次握手/四次挥手的过程?为什么挥手要四次而握手只要三次?SYN攻击属于哪个阶段?
  • 说说https的原理(结合传输层和应用层来谈)?为什么http性能比https好?为什么https比http安全?
  • 团队管理
    • 说说你是如何管理前端团队的?
    • 如果说团队里面两个同学业务表现都得到了业务方的认可,那你还会从哪些方面去定KPI?
    • 能不能找一两个你最熟悉的项目,然后聊聊你在里面做的事情(收获)?

综面:

主要聊项目,中间也会穿插些技术问题。体现学习能力、抗压能力、敬业精神;会深挖简历中提到的每个技术点。

  • 你最熟悉的项目是哪个?说说项目架构?你负责的是哪部分?有什么亮点/业绩?使用了哪些技术?为什么要用这些技术?
  • 你觉得你最大的优势是什么?
  • 说说未来三年的职业规划?
  • 说一次失败的经历?
  • 工作过程中遇到的最大挑战是什么?如何解决的?
  • 为什么要离职?
  • 说说你的优缺点?
  • 说说你在项目中遇到的最大挑战是什么?
  • 说说你的前端项目架构是怎么样的?你觉得什么地方还可以再改进?
  • 你觉得要让你加入我们团队的话,你最大的优势是什么?
  • 说说你是怎么带前端团队的?
  • 团队中每个人的开发方式是不相同的,你们团队用了哪些方式来保证代码质量?
  • 如果团队有新人进来,有什么办法可以使其在一周左右的时间开始进行业务开发?
  • 团队中有没有做工程化工具方面的提炼?
  • 说说你的每段工作经历以及每段经历中的收获,现在回顾这些工作经历,你觉得哪些是对你成长最有帮助的?
  • 如果加入一个新团队/公司,你现在的顾虑有哪些?你准备怎么去解决/消除顾虑?

总结

  • 语速可以放慢点
  • 当跟别人描述工作内容或者经历的时候应该挑重点来讲(因为别人会很容易找不到重点),所谓重点:问题是什么?怎么发现?怎么解决?收获是什么?
  • 平时工作中就要养成总结/复盘的习惯
  • 跟面试官聊的时候可以放松些,把整个过程当成是聊天,而不是问答式的对话,这样有利于你更清楚的描述你的工作内容,也有利于别人听懂你的描述

推荐阅读更多精彩内容