假如我是前端面试官
想想工作近两年了,被别人的面试过的次数不多,大概只有四五场。下个月离职了,因此最近在帮公司招前端,参与了几场面试(其实去年这个时候,也是在帮前公司招前端)。之前一直在准备离职后回成都的面试,发现被别人面试和面试别人的感觉是完全不一样的。
算下来大概面试了十多个人了,因此可以假装自己是个前端面试官。今天突然想到一个问题,如果我是一个真正的前端面试官,我要问些什么问题呢?
感觉面试官是一个很难得岗位,需要同时具备知识的广度和深度,所以说我现在只是一个假的前端面试官。
年后就一直在梳理自己的前端知识体系,并把相关总结整理在了github上,这里我会尝试列出我觉得比较有意思的前端面试题,但是并不会给出答案————否则篇幅就太长了(主要是懒哈哈)。
基础知识
基础知识部分主要考察HTML、CSS和JS的一些常见问题,看看面试者基础是否扎实
HTML
面试一般不会单纯问HTML标签是干啥的,而是侧重于浏览器是如何处理HTML文档的
- 对于语义化和结构化的理解
- 浏览器是如何加载HTML文档的,梳理一下网络的相关流程
- 浏览器是如何解析HTML文档的,考察CSS和JS对文档解析的影响,顺带可以问一下async和defer属性
- 浏览器是如何渲染HTML文档的,这里可以问一下repaint和refollow
CSS
写好CSS不是一件很容易的是,加上面试时间有限,一般更侧重面试者的业务逻辑能力,通过下面几个问题可以了解一下面试者是否研究过CSS
- BFC是啥
- 选择器的解析顺序是从左到右还是从右到左
- 样式继承,样式权重值计算规则
- 行高的计算规则,数字、百分比、乘积因子有啥区别
- SCSS中的常见用法,mixins和extends编译后的语法是什么样子的
- rem布局和实现原理,是否考虑过纯CSS实现rem布局
- bootstrap中栅格系统的原理,为何通过
col-xs
和col-sm
可以控制在不同分辨率下的布局 - 你觉得CSS Module怎么样
- 平常怎么管理样式表的,有听过BEM吗
- 有了解过flex布局和grid布局吗
- 有没有做过css动画,具体是怎么实现的呢
JavaScript
JavaScript基本是面试考察的重点,甚至有可能正常面试大部分时间都在围绕JS展开,这里可以考察面试者的编程能力
下面是关于JavaScript语法的一些题目,基本上很多题目都可以展开,看看面试者是否具备扎实的语言基础
- 函数参数传递,所有参数实际都是按值传递的,只是区分为了字面量值和内存地址值,这一点经常有人搞错
- JS中的词法作用域,左查询和右查询的区别,变量声明提升,函数作用域与块级作用域
- 根据词法作用域引申出作用域链,描述一下变量进行右查找时的过程
- 根据词法作用域引申出闭包,这个问题基本面试免不了俗的,看看每个人如何回答吧
- 根据词法作用域引申出this的动态性,在四种规则下this的指向规则以及他们的优先级
- 原型和原型链,这个也是基本都要问的,基本谈到委托查找就可以了
- JS中的同步和异步,理解代码的执行顺序
- 对ES6/7了解多少,在项目中用了哪些新特性
Promise
的使用,是否了解标准和内部实现原理- JS模块化,AMD、CommonJS和ES6标准模块,是否用过
RequireJS
、SystemJS
等模块加载器
其次考察一下DOM和BOM,貌似我在面试中很少问过也很少遇到过DOM相关的问题
- 事件模型,事件委托的原理和实现
- 如何减少DOM操作次数,
DocumentFragment
有了解过吗 - Cookie、localStorage和SessionStorage几种存储方式和区别,以及他们的优劣点,各自有什么应用场景
- 函数节流和函数去抖的原理和实现
- 可以使用原生DOM接口实现将节点插入目标节点之后的函数
insertAfter
吗 - 了解过
requestAnimFrame
实现动画效果吗
TypeScript
- 在项目中是如何使用TS的,有什么优劣?
- TS的类型编程
项目
项目经验这里一般重点考察框架使用和常见的业务问题,比如跨域、性能优化、web安全等
开发环境搭建
现在一般会问到webpack和gulp
- 平时是怎么搭建前端开发环境的,是否了解webpack常见配置和gulp任务的编写
- 如何区分开发环境和打包环境
- 能简单描述一下webpack的工作流程吗?他和gulp有什么区别
- 热更新的工作原理是什么
- 你们是如何管理第三方CDN模块的,他们是如何在项目中使用的
- 参与过前后端分离的项目吗?你们是怎么处理数据接口的,用过mockjs吗
- 如何在开发中代理接口请求
- 自己发布过npm的包吗
跨域
跨域是前端中比较常见的业务场景,可以考察面试者项目经验
- 有没有在项目中碰见过跨域的问题,为什么会产生跨域
- 你们是如何解决跨域问题的,还有其他的解决办法吗
- 可以讲一下JSONP的原理和实现吗
- 自己配置过CORS吗,这里可以扩展一下
Access-Control-Allow
其他几个头部 - 遇见过接口请求前多出一次 OPTIONS 请求的情形吗?这是什么原因
- 有没有了解过
postMessage
Vue
由于公司的技术栈是Vue,因此一般通知过来面试的也是有相关使用经验的
如何将axios绑定到
this.$http
上面呢通过
[]
直接向数组添加元素为什么不会触发视图更新呢?怎么处理这种情况父子组件嵌套时,父子组件内部的各个生命周期钩子触发先后顺序
数据代理,为什么可以通过
this.xx
访问到this.$data.xx
呢数据更新策略,数据更新触发的DOM更新是同步的吗?谈谈你对于nextTick的理解
vue-router的hash模式和history模式,对应的实现机制是什么
你们在项目中是如何使用vuex的
SPA中,你们是怎么进行接口用户权限身份认证的
有没有了解过SSR,能介绍一下原理吗
在SPA项目中是如何进行性能优化的
有没有踩过印象比较深刻的坑
是否阅读过源码,如果是可以问下面的一些问题
响应式系统的原理,如何进行依赖收集的
了解前端模板引擎的实现原理吗
模板编译经历了哪过程,他们的作用是啥
虚拟节点是啥,为什么要使用VNode呢
patch操作中的diff算法,有了解吗
你觉得Vue有哪些不好的地方
webview
由于公司的app内部有一部分是web业务,因此需要对webview有一定了解
- 有app内部的webview页面开发经验吗
- Android和iOS原生与JS交互是如何操作的?他们又什么区别
- 有尝试过对客户端的接口进行整合及封装吗
- 如何进行移动端的页面调试呢?除了alert
- 有没有遇见什么比较难忘的坑
- 有适配iPhoneX的经验吗
微信开发
公司的另外一部分业务放在微信生态中,要求对小程序和公众号开发有一定的了解
- 了解微信网页授权的流程吗
- 有微信JSSDK的使用经验吗,有没有踩过什么坑?appid大小写算一个哈哈
- 了解微信自定义开发吗
- 向用户批量推送模板消息的功能是如何实现的
- 你们是如何进行小程序开发的,使用过wepy吗
- 你们项目中识别用户渠道来源是怎么实现的
性能优化
性能优化一般会围绕着减少http请求,页面加载速度,页面运行效率这三个方面来提问
- 谈谈web项目中常用的优化手段
- 如何加快首屏渲染
- 有哪些减少http请求的手段
- 图片懒加载和预加载的原理是什么,他们的应用场景呢
- 图片base64内联有什么优点和缺点
- 有没有了解过DNS预解析
- 谈谈对于缓存的理解,
max-age
和expries
有什么区别,条件请求是什么 - 你们在项目中使用过缓存吗,怎么设置的
Web安全
前端web安全一般会围绕着xss和csrf这些常见的场景回答
- 你对web安全有怎样的了解
- xss是怎样产生的,该如何防护
- csrf是怎样产生的,该如何防护
- 如何保证Cookie的安全,httpOnly和secure有什么区别
网络
网络相关的知识可以考察学习的广度,基本上HTTP知识是必问的点
- 会抓包吗,使用的是什么工具
- 从输入url到浏览器展示整个网页,发生了什么
- 三次握手、四次挥手、IP寻址、广播查询MAC地址等概念
- HTTP报文,常见的状态码、头部、主体等
- 能描述一下https的原理吗?https有什么优点和缺点
- 你们是如何调试接口的
后台
现在基本上都要求后台会一些前端知识,前端懂一些后台知识。我们公司的后台是PHP,因此一般都会问问面试者会不会PHP,以及相关的框架经验。
- 会PHP吗,用过Laravel框架吗,在项目中使用过哪些特性
- 会NodeJS吗,用过express或者koa框架吗,你觉得他们有什么区别
- 是否使用原始的PHP或者NodeJS写后台业务,程序的大致流程是什么样的呢
- 如何将URL映射到对应的控制器方法上的呢?如何根据URL找到对应的控制器方法
- 服务端渲染和客户端渲染有什么区别
- 在服务端渲染中,你们是如何通过模板引擎管理模板的
- 了解过RESTful接口规范吗
- 用户身份认证是如何处理的
拓展
好吧面试我反正是没遇见过来问计算机基础知识的,毕竟不是校招了
- 计算机组成,CPU、内存等
- 操作系统相关的概念,比如进程、存储管理、IO系统、文件系统等
- 数据结构,用JS实现常见的数据结构
- 算法,实现经典算法,如快排、二分查找等
小结
突然发现好像写了不少问题,单场面试中肯定问不了这么多东西的。一般在面试中,对于面试者的了解也仅限于简历上的描述,因此一般都会从简历入手,对掌握技能、项目经验等方面进行提问,因此上面很多题目都不应该是单单问一下就结束了,而是可以逐步深入,引导性提问。
最近一直在准备面试,更发现那句话的重要性
面试的信心来自于自身扎实的基础,切勿急功近利,好逸恶劳~自勉之。
每次的面试准备都相当于是对于自己掌握知识体系的一个梳理,知道自己会什么,还欠缺什么,总比盲目的背题目要好得多。
好吧其实上面有一部分题目,由于需要回答的东西比较多,因此我还是整理相关的答案,预备在之后的面试中可以从容回答。
这份面试题跟市面上看见的面试题可能有些出入,有些比较基础的或者比较常见的问题,我没有一一列出来了。
这篇博客等到下次准备面试的时候,可能还会继续更新哈哈~
你要请我喝一杯奶茶?
版权声明:自由转载-非商用-保持署名和原文链接。
本站文章均为本人原创,参考文章我都会在文中进行声明,也请您转载时附上署名。