面了20多家前端大厂，大厂面试到底考什么？（经验总结）

前言

博主17年毕业的，普通本科毕业，到如今已经有三年多的经验了，之前在一个创业小公司工作。最近准备跳槽，面了将近20家公司，其中有你们应该都听过的BAT，今日头条，京东，网易，大疆，oppo，还有shopee，招商金科，有赞等比较不错的公司收获了六个offer。最后选择了入职阿里巴巴深圳

因此该面试经验适用于3年以内，薪资待遇为13-25k的面试。

在这里对我的面试经历做一个简单的分享，希望对大家有帮助。在这里，我不会一家一家的公司去细列他们去问了什么，只会去讲述下面试流程面试中可能碰到的问题以及我的部分解答。

面试流程

如果你时间紧张或是在职，大部分大公司是支持第一轮电话面试的，而腾讯，阿里的面试基本前两轮都是电话面。最近流行专场招聘，可以一天面试完。基本来说，流程可能是

组员面 --> 组长面 --> 总监面 --> hr面

组员面

组员面一般来说是跟你同级别的人，所以不要紧张，他的水平不一定会比你高很多，充分展现自己的优势和特长。组员面总体来说考察的东西较基础。会关注一些后面不会关注的css，html等

组长面

组长面一般来说是组长来面，考察范围不再是前端代码方面的东西，可能会问些别的小公司不会问的问题

总监面

这时一般来说很少问你具体的的代码细节了，当然自我介绍和项目介绍还是要的，这时就像是一种聊天，看你的未来规划。

hr面

说实话我比较少hr面，基本也是跟总监面聊天一样，不过你最好还是要问一下他这些问题：

1. 加班时间及相关制度
2. 离职率
3. 公积金，社保的基数，公积金比例
4. 公司或者部门未来的规划
5. 对比其他公司的优势

经验分享

下面我分享一下这段时间主要复习的点，希望可以帮助一些想要换工作的小伙伴。

我分享的这个面试题资料涵盖了：JS、JQuery、数据请求相关问题、ES6、Vue、React、微信小程序、IOS/Andriod浏览器适配问题整理、Pc端兼容性问题、项目类问题、笔试编程题等。

注：需要完整版前端资料的小伙伴可以直接点击这里获取学习

 JS

• JS是一种什么样的语言?
• JS数据类型有哪些?
• 介绍JS有哪些内置对象？
• 栈与堆的区别?
• js中的作用域与变量声明提升
• 如何转化类型?
• 什么是面向对象编程及面向过程编程，他们的异同和优缺点
• 面向对象编程思想
• 如何解释this在js中起的作用?
• js中this的用法（经典）：
• ☆说说JS原型和原型链
• 如何准确判断一个变量是数组类型?
• ☆call和apply的区别和作用?
• 继承的方法有哪些？
• ☆什么是闭包？闭包有什么作用？
• 事件代理（事件委托）:
• 事件的各个阶段
• ☆new操作符在创建实例的时候经历了哪几个阶段
• 异步编程的实现方式
• 对原生JS了解程度
• js延迟加载的方法有哪些？
• 数组从小到大排序？
• 求从大到小排序可以先使数组从大到小排序,然后添加reverse()方法，使数组顺序颠倒

JQuery:

• 你觉得jQuery或zepto源码有哪些写的好的地方
• jQuery的实现原理？
• jQuery.fn的init方法返回的这指的是什么对象？为什么要返回这个？
• jQuery.extend与jQuery.fn.extend的区别？
• jQuery的属性拷贝（extend）的实现原理是什么，如何实现深拷贝？
• JQuery的队列是如何实现的？队列可以用在哪些地方?
• jQuery中的bind（），live（），delegate（），on（）的区别？
• jQuery一个对象可以同时绑定多个事件，这是如何实现的？
• 针对jQuery的优化方法

数据请求相关问题

• http请求方式有哪些？
• http的状态码有哪些？分别说下它们的含义
• 请描述一下get与post的区别
• get请求传参长度的误区
• http和https有何区别？如何灵活使用？
• 什么是AJax?为什么使用Ajax?
• 简述ajax的过程。
• Ajax优缺点？
• XMLHttpRequest通用属性和方法
• Ajax请求跨域接口，发送了几次请求？
• 跨域的几种方式
• web应用从服务器端主动推送data大客户端有哪些方式?
• 如何实现浏览器内多个标签页之间的通信? (阿里)
• webSocket如何兼容低浏览器？(阿里)
• fetch、ajax、axios之间的详细区别以及优缺点：
• 为什么要用axios？
• axios是什么？怎么使用？描述使用它实现登录功能的流程？
• xml和json的区别？

ES6

• 列举常用的ES6特性：
• 箭头函数需要注意哪些地方？
• 箭头函数和普通函数之间的区别
• let、const、var
• 拓展：var方式定义的变量有什么样的bug？
• 箭头函数this的指向。
• 手写ES6 class继承。
• ES5的继承和ES6的继承有什么区别?
• ES6 class 的new实例和ES5的new实例有什么区别?
• generator生成器函数:
• 什么是async/await及其如何工作?
• Promise和async await以及它们之间的区别:
• async函数的基本用法:
• async与generator的区别?
• 简单实现async/await中的async函数
• 有用过promise吗？请写出下列代码的执行结果，并写出你的理解思路

React

• react的优势以及特点
• React中的props和state的用法
• react组件之间如何通信？
• 为什么虚拟DOM会提高性能？
• react生命周期函数：
• react性能优化是哪个周期函数？
• 在生命周期中的哪一步你应该发起AJAX请求？
• 概述一下REact中的事件处理逻辑
• 如何告诉React它应该编译生产环境版本？
• 调用setState之后发生了什么？
• react的setState的原理及用法
• setState为什么是异步的?
• 传入setState函数的第二个参数的作用是什么?
• shouldComponentUpdate的作用是啥以及为何它这么重要？
• createElement与cloneElement的区别是什么？
• 为什么我们需要使用React提供的Children API而不是JS的map？
• React中的Element与Component的区别是？
• 在什么情况下你会优先选择使用class Component而不是functional Compone
• React中refs的作用是什么？
• React中keys的作用是什么？
• diff算法？
• React性能优化方案？
• react怎么从虚拟dom中拿出真实dom

其他知识点面试题

• Node的应用场景
• 谈谈你对webpack的看法
• gulp是什么？
• 常见的web安全及防护原理
• XSS原理及防范方法
• CSRF的原理及防御
• XSS与CSRF两种跨站攻击
• common.js AMD CMD的区别
• ES6模块有CommonJS模块的差异
• 网页验证码是干嘛的，是为了解决什么安全问题
• webpack的原理
• webpack的loader和plugin的区别？
• 怎么使用webpack对项目进行优化?
• 防抖、节流
• 浏览器的缓存机制
• 描述一下二叉树, 并说明二叉树的几种遍历方式?

由于篇幅问题，资料实在太多，我就不全部展示了。

最后

与其去一个个背面试题，去猜面试官可能会问什么问题，不如多去思考，大公司需要怎样的人才？面试官想要招些怎样的人？通过上面内容，希望你有可以一些自己的思考，不足疏漏的去补充，已经有的去充分展现。