前端面试分享: 两年经验社招-阿里巴巴

做者两年经验, 第一家任职的是个小公司, 第二家算是二线互联网公司, 各待了一年吧... 能有机会去阿里面试很惊喜! 先来和你们分享一下面试经历...

电话面试初探

由于还在职的缘故,电话面试从晚上8点钟开始, 持续了半个小时左右, 一开始的时候特比紧张,甚至声音略有些颤抖 = =!

1. 简单自我介绍, 作过哪些项目, 使用哪些技术栈 ? 这个就没什么好说的,因人而异,不要吹本身并不熟悉的技术,省得被深刻问的时候答不上来
2. 如何看待前端框架选型 ? 我比较熟悉vue和react 就主要提到了这两款框架各自的优势和缺点以及性能对比, 以及上手难度, 社区生态, 团队成员组成, 招聘难度啊 blabla...
3. vue的如何实现双向绑定的 ? Object.defineProperty() 这个方法来追踪依赖并来完成UI的更新
4. react virsualDOM 是什么? 如何实现? 说一下diff算法 ? vm网上资料不少, 实现其实也只是解析JSX -> AST语法树, diff算法主要是说了react如何将O(n3)的算法下降到O(n)级别的
5. 工做中最出色的点, 和你最头疼的问题 如何解决的 ? 还好提早准备到了, 现场想确定就黄了... (捂脸)
6. 平时如何学习, 最近接触了解了哪些新的知识 ? 什么github 各类论坛 书籍... 想到的都说了就成

结束以后,面试官不告诉我结果说让我等通知, 而后挂了电话一分钟后, 电话就来了... 约我次日去办公地点面试 ! (效率还挺高)...

---

技术一面

一面的面试官很和善,彬彬有礼, 让我顿时放松了许多

1. 简单自我介绍, 介绍一下你的项目, 技术栈 ?
2. react和vue的比较 ?
3. React Diff 算法 ? 和电话面试前三题基本同样, 从你的回答中面试官来找问题, 可能我回答类似度高吧, 问题都类似
4. 观察者模式实现 ? 设计模式其实看的很少, 只是说了一下大致的思路
5. http报文头部有哪些字段? 有什么意义 ? 这个就不少了, cookie cache-control user-agent expires host refer 等等 挑你会的经常使用的说, 面试官也不会要求你都说全的
6. 移动端高清方案如何解决 ? 这里被卡住了, 没有理解到是rem布局+几倍图+1px问题, 只提到了flexible.js,而且说了一下原理,如今回头看,说的仍是有问题... 仍是有点久了,忘记了
7. webpack的原理, loader 和 plugin 是干什么的? 有本身手写过么 ? 大体说了一下,webpack解析模块, loader和plugin的做用, 没有手写过, 看过一部分代码...
8. 简述从网页输入url到网页展现的过程发生了哪些事情 ? 说的仍是比较粗, 不太重点DNS解析,三次握手,数据请求,浏览器如何解析DOM树,css树应该都提到了, 还提到了浏览器的多进程多线程架构,js线程和渲染线程互斥
9. 细节问题: 个人项目中是一套代码实现了PC h5兼容 ,组件耦合严重, 问有没有什么好的解决方案 ? 只想到了把数据层抽象出来,可是其余的不知道该如何解决... 如今也不知道- . -
10. SSR 和 客户端渲染有什么区别 , vue是如何实现绑定事件的 ? 简述服务端渲染大概经历了哪些过程, 最后生成HTML文件,而且有flag让框架知道这是已经由服务端渲染完毕, store中的数据通常会挂在在window.__inialState__下... vue绑定事件的实现, 不太明白考官的意思, 简述了vue经过声明的方式来书写事件绑定代码, 实现订阅发布的模式, 对DOM原生事件作了一层封装 云云... 也不知道说的对不对
11. 简述公司node架构中容灾的实现 ? 由于我提到了这个, 答的很模糊, 估计有很多漏洞... 实际上应该是cdn slb node三层容灾
12. 浏览器事件有哪些过程? 为何通常在冒泡阶段, 而不是在捕获阶段注册监听? addEventListener 参数分别是什么 ? 第一个很简单, 捕获,元素,冒泡 第二个当时没回答出来, 后来查到多是IE8如下没有捕获阶段, 还有多是冒泡比较符合通常控制事件影响的通常习惯
13. 面向对象如何实现? 须要复用的变量 怎么处理 ? ES5的构造函数+prototype ES6的class 复用的变量放在构造函数的原型上
14. 移动端300ms延时的缘由? 如何处理? 移动端双击的设置,致使会有300ms系统判断的延时. fastclick, 或者touchEnd来代替
15. 主流框架的数据单向/双向绑定实现原理 ? vue defineProperty(), react setState() DOMdiff, 订阅发布模式 展开来讲一下就能够了
16. 简述转行经历, 如何学习 ? 做者入坑以前,还作过两年建筑设计... 因此大概诉说了下辛酸史 (捂脸)
17. 你以为本身在前端工做的最大的优势是什么 拿实际工做的内容举例? 这里实际上很丢脸, 吹了一波, 结果被问细节的时候, 愣是想不起来实际工做例子... 结果面试官看我很尴尬 就换了个话题= . =

最后聊了一下子,问了一下团队状况,换我的继续二面

---

技术二面

1. 和一面前3问基本一致,简述项目,React vue区别 virsualDOM实现
2. DIFF算法为何是O(n)复杂度而不是O(n^3)
3. http code码? 200 302 304等等
4. 移动端rem布局如何实现? 简述原理? 这个网上有不少,简单说就是rem能够经过控制html的字体大小来统一做为标杆,其余的rem宽度能够跟随调整, 只须要将html根字体和移动端宽度大小作关联计算就能够
5. JSbridge原理, js和native是如何通讯的? 问的比较深,我也是只知其一;不知其二... 就说了一些schema和native方法注入webview来执行代码,ios使用iframe来通讯
6. Rollup和webpack区别, treeshaking是什么? 为何能够实现
7. TCP三次握手的过程, get post请求的区别 ?
8. 静态文件的浏览器缓存如何实现? 其实仍是考察http相关的缓存只是,答出来cache-control expires Etag 304 浏览器如何识别相同文件等等就能够了
9. 前端跨域方案 JSONP CORS document.domain nginx/nodejs代理 等等
10. http 请求包含哪些字段 分别是什么意思
11. js 有哪些数据类型 如何判断? null 和 undefined区别 应用场景? 基本类型和复杂类型, typeof instanceof Object.prototype.toString 第二个答出来, 平时工做中不多注意到
12. new String('a') 和 'a' 是同样的么? 一个是字符串对象,一个是基本类型
13. 移动端如何实现下拉到底部 跟随移动 结束后回弹的动画? 了解iScroll的话,应该不难
14. 移动端如何优化首页白屏时间过长 ?
    雅虎军规,还有一些其余的移动端优化,还有离线包或者serviceworker之类的,还趁机问了下团队是采用哪一种方案,也是离线包
15. ES6 generator函数简述
16. 数组去重实现? 网上不少, 说了new Set([...array]) 循环遍历indexOf 最快的对象键值对的方法
17. js浮点数运算不精确 如何解决? 这个真不会, 回来看了下才知道
18. 工做中最得意和出色的点, 头疼的点, 问题如何解决的
19. 为什么换工做? *哈哈, 回答--- 大厂梦~ *
20. 聊了下阿里的压力,文化

---

技术三面

这一面听说是p8大佬,面的时候并不知道,聊的时候挺晚的了,没以前紧张,轻松了不少

1. 公司的前端工程化实践
2. 转行以后是如何自学前端的, 学习途径 有没有一些本身的代码
3. DOM基础知识,添加元素,删除元素等等...
4. DOM节点类型 这就属于给本身挖坑, 提到了... 结果过久没看了,忘了
5. 正则表达式如何匹配一段url ?在正则表达式中有哪几种做用? 正则平时写的比较多,同事常常会让我帮忙写正则, 这个却是没啥问题
6. 移动端优化方式? 离线包是如何实现的?
7. 最后聊了一下项目,聊了一下目前公司

最后跟我说技术面试经过了(很爽快~), 后面会有HR来面我...

---

后面就是很紧张的经过了HR面试, 定级P6 目前还在最后的流程中, 还在等待offer, 祝我一切顺利吧! ^ - ^