作者两年经验, 第一家任职的是个小公司, 第二家算是二线互联网公司, 各待了一年吧…
能有机会去阿里面试很惊喜!
先来和大家分享一下面试经历…
电话面试初探
因为还在职的缘故,电话面试从晚上8点钟开始, 持续了半个小时左右,
一开始的时候特比紧张,甚至声音略有些颤抖 = =!
- 简单自我介绍, 做过哪些项目, 使用哪些技术栈 ?
这个就没什么好说的,因人而异,不要吹自己并不熟悉的技术,免得被深入问的时候答不上来 - 如何看待前端框架选型 ?
我比较熟悉vue和react 就主要提到了这两款框架各自的优点和缺点以及性能对比, 以及上手难度, 社区生态, 团队成员组成, 招聘难度啊 blabla… - vue的如何实现双向绑定的 ?
Object.defineProperty() 这个方法来追踪依赖并来完成UI的更新 - react virsualDOM 是什么? 如何实现? 说一下diff算法 ?
vm网上资料很多, 实现其实也只是解析JSX -> AST语法树, diff算法主要是说了react如何将O(n3)的算法降低到O(n)级别的 - 工作中最出色的点, 和你最头疼的问题 如何解决的 ?
还好提前准备到了, 现场想肯定就黄了… (捂脸) - 平时如何学习, 最近接触了解了哪些新的知识 ?
什么github 各种论坛 书籍… 想到的都说了就成
结束之后,面试官不告诉我结果说让我等通知, 然后挂了电话一分钟后, 电话就来了…
约我第二天去办公地点面试 ! (效率还挺高)…
技术一面
一面的面试官很和蔼,彬彬有礼, 让我顿时放松了许多
- 简单自我介绍, 介绍一下你的项目, 技术栈 ?
- react和vue的比较 ?
- React Diff 算法 ?
和电话面试前三题基本一样, 从你的回答中面试官来找问题, 可能我回答相似度高吧, 问题都相似 - 观察者模式实现 ?
设计模式其实看的不多, 只是说了一下大体的思路 - http报文头部有哪些字段? 有什么意义 ?
这个就很多了, cookie cache-control user-agent expires host refer 等等 挑你会的常用的说, 面试官也不会要求你都说全的 - 移动端高清方案如何解决 ?
这里被卡住了, 没有理解到是rem布局+几倍图+1px问题, 只提到了flexible.js,并且说了一下原理,现在回头看,说的还是有问题… 还是有点久了,忘记了 - webpack的原理, loader 和 plugin 是干什么的? 有自己手写过么 ?
大致说了一下,webpack解析模块, loader和plugin的作用, 没有手写过, 看过一部分代码… - 简述从网页输入url到网页展示的过程发生了哪些事情 ?
说的还是比较粗, 不过重点DNS解析,三次握手,数据请求,浏览器如何解析DOM树,css树应该都提到了, 还提到了浏览器的多进程多线程架构,js线程和渲染线程互斥 - 细节问题: 我的项目中是一套代码实现了PC h5兼容 ,组件耦合严重, 问有没有什么好的解决方案 ?
只想到了把数据层抽象出来,但是其他的不知道该如何解决… 现在也不知道- . – - SSR 和 客户端渲染有什么区别 , vue是如何实现绑定事件的 ?
简述服务端渲染大概经历了哪些过程, 最后生成HTML文件,并且有flag让框架知道这是已经由服务端渲染完毕, store中的数据一般会挂在在window.__inialState__下… vue绑定事件的实现, 不太明白考官的意思, 简述了vue通过声明的方式来书写事件绑定代码, 实现订阅发布的模式, 对DOM原生事件做了一层封装 云云… 也不知道说的对不对 - 简述公司node架构中容灾的实现 ?
因为我提到了这个, 答的很模糊, 估计有不少漏洞… 实际上应该是cdn slb node三层容灾 - 浏览器事件有哪些过程? 为什么一般在冒泡阶段, 而不是在捕获阶段注册监听? addEventListener 参数分别是什么 ?
第一个很简单, 捕获,元素,冒泡 第二个当时没回答出来, 后来查到可能是IE8以下没有捕获阶段, 还有可能是冒泡比较符合一般控制事件影响的一般习惯 - 面向对象如何实现? 需要复用的变量 怎么处理 ?
ES5的构造函数+prototype ES6的class 复用的变量放在构造函数的原型上 - 移动端300ms延时的原因? 如何处理?
移动端双击的设置,导致会有300ms系统判断的延时. fastclick, 或者touchEnd来代替 - 主流框架的数据单向/双向绑定实现原理 ?
vue defineProperty(), react setState() DOMdiff, 订阅发布模式 展开来说一下就可以了 - 简述转行经历, 如何学习 ?
作者入坑之前,还做过两年建筑设计… 所以大概诉说了下辛酸史 (捂脸) - 你觉得自己在前端工作的最大的优点是什么 拿实际工作的内容举例?
这里实际上很丢脸, 吹了一波, 结果被问细节的时候, 愣是想不起来实际工作例子… 结果面试官看我很尴尬 就换了个话题= . =
最后聊了一会儿,问了一下团队情况,换个人继续二面
技术二面
- 和一面前3问基本一致,简述项目,React vue区别 virsualDOM实现
- DIFF算法为什么是O(n)复杂度而不是O(n^3)
- http code码? 200 302 304等等
- 移动端rem布局如何实现? 简述原理?
这个网上有很多,简单说就是rem可以通过控制html的字体大小来统一作为标杆,其他的rem宽度可以跟随调整, 只需要将html根字体和移动端宽度大小做关联计算就可以 - JSbridge原理, js和native是如何通信的?
问的比较深,我也是一知半解… 就说了一些schema和native方法注入webview来执行代码,ios使用iframe来通信 - Rollup和webpack区别, treeshaking是什么? 为什么可以实现
- TCP三次握手的过程, get post请求的区别 ?
- 静态文件的浏览器缓存如何实现?
其实还是考察http相关的缓存只是,答出来cache-control expires Etag 304 浏览器如何识别相同文件等等就可以了 - 前端跨域方案
JSONP CORS document.domain nginx/nodejs代理 等等 - http 请求包含哪些字段 分别是什么意思
- js 有哪些数据类型 如何判断? null 和 undefined区别 应用场景?
基本类型和复杂类型, typeof instanceof Object.prototype.toString 第二个答出来, 平时工作中很少注意到 - new String(‘a’) 和 ‘a’ 是一样的么?
一个是字符串对象,一个是基本类型 - 移动端如何实现下拉到底部 跟随移动 结束后回弹的动画?
了解iScroll的话,应该不难 - 移动端如何优化首页白屏时间过长 ?
雅虎军规,还有一些其他的移动端优化,还有离线包或者serviceworker之类的,还趁机问了下团队是采用哪种方案,也是离线包 - ES6 generator函数简述
- 数组去重实现?
网上很多, 说了new Set([…array]) 循环遍历indexOf 最快的对象键值对的方法 - js浮点数运算不精确 如何解决?
这个真不会, 回来看了下才知道 - 工作中最得意和出色的点, 头疼的点, 问题如何解决的
- 为何换工作?
哈哈, 回答— 大厂梦~ - 聊了下阿里的压力,文化
技术三面
这一面据说是p8大佬,面的时候并不知道,聊的时候挺晚的了,没之前紧张,轻松了很多
- 公司的前端工程化实践
- 转行之后是如何自学前端的, 学习途径 有没有一些自己的代码
- DOM基础知识,添加元素,删除元素等等…
- DOM节点类型
这就属于给自己挖坑, 提到了… 结果太久没看了,忘了 - 正则表达式如何匹配一段url ?在正则表达式中有哪几种作用?
正则平时写的比较多,同事经常会让我帮忙写正则, 这个倒是没啥问题 - 移动端优化方式? 离线包是如何实现的?
- 最后聊了一下项目,聊了一下目前公司
最后跟我说技术面试通过了(很爽快~), 后面会有HR来面我…
后面就是很紧张的通过了HR面试, 定级P6
目前还在最后的流程中, 还在等待offer, 祝我一切顺利吧! ^ – ^
