前端 2018 届校招笔试面经【百度，阿里，腾讯，阿里文娱，携程，美团，拼多多】

另附上本人 2017 届面经

2017年秋季校招前端面经（百度，腾讯，网易，华为，乐视等）

百度

1.块级元素和行内元素的区别和举例
2.HTML5的新特性
3.清除浮动的方法
4.BFC清除浮动的原理
5.盒子模型
6.标准模式和兼容模式
7.闭包的定义
8.原型链和做用域链
9.做用域链和闭包的区别
10.Object的原型对象是什么
11.怎么判断一个属性是对象上的属性仍是其原型对象上的属性
12.判断一个对象类型为数组
13.网络安全的防护
14.localStorage和cookie的区别
15.前端性能优化
16.层叠上下文
17.手写events模块
18.手写将一个段落里的单词首字母都大写的函数

1.三栏式布局
2.块级元素和行内元素的区别和举例
3.h5语义化理解，新增了哪些标签
4.css有哪些选择器,权重多少
5.get和post区别
6.浏览器缓存机制
7.盒子模型
8.es6有哪些新特性
9.跨域有哪几种实现方式
10.邮箱正则匹配 xx@xx.com/cn
11.实现一个反转字符串的函数
12.段落首字母大写函数
13.观察者模式
14.快速排序怎么实现的

腾讯

1.为何喜欢学习前端。
2.对MVVM框架的理解。
3.angularJS双向绑定原理。
4.了解过其余的MVVM框架吗。
5.React虚拟DOM原理。
6.单向数据流动原理。
6.html5，css3，ES6新特性。
7.ES6中比较好用的语法。
8.对闭包和做用域的理解。
9.js怎么实现面向对象。
10.实现动画的方式。
11.网站性能优化。
12.如何查看一个网站的性能。
13.网站上线后如何查看网站在客户电脑上的性能。
14.收集用户信息主要收集哪些信息。
15.如何进行跨站请求。
16.若是实现跨域资源共享。
17.网站开发的流程，像是技术选型，人员分工这一类，越详细越好。
18.网络分层分为哪几层。
19.状态码301,302。
20.网络中每一层都有哪些协议。
21.浏览器的缓存分为哪几种。
22.经常使用的排序算法。
23.Web安全。
24.XSS攻击原理及如何防止。
25.须要屏蔽哪些关键词。
26.了解CDN吗。
28.OPTIONS请求的做用。
29.HTTP协议有哪些内容。
30.HTTP2.0新特性。
31.HTTPS相对于HTTP新增了哪些内容。
32.HTTPS是怎么对传输内容进行加密的。
33.同一个页面里面iframe之间怎么传递信息。
34.网站如何实现离线应用。
35.cookier有4096B（加减1）字节的长度限制，容量是多少？js高阶教程p629
36.js怎么实现表单提交按钮的短时间重复点击。
37.ajax的post、get方法，优缺点，实现原理
38.盒模型
39.跨域请求方式
40.浏览器安全问题
41.input鼠标滑过获取内容
42.项目中遇到的困难
43.css带src的标签 <link> <a> <img> <audio> <video>
44.谈谈对闭包的理解
45. var x=5, o={
x:10,
show:function(x){
var x=20;
console.log(this.x);//10
(function show1(){
console.log(this.x);//5
})();
function show2(x){//x是window
console.log(this.x);//5
}
show2(x)
}
}
o.show();
46.typeof(null)==object

47.浏览器缓存的底层实现原理
48.设计模式
49.css框架实现（例如：bootstrap有哪些文件，做用）
50.常常浏览哪些网站(知乎、大漠、阮一峰博客等等，最好说下对公司对应的哪些技术感兴趣)
51.百度前端学院，作了哪些题，怎样实现

阿里

一面
一、自我介绍以后，一个项目一个项目介绍
二、vue的双向绑定
三、vuex数据流动过程
四、ajax应用场景以及优缺点
五、http请求中post和get请求的区别
六、跨域cros和jsonp；jsonp是怎么获取数据的
七、闭包及应用
八、说一下js的继承。es6里面的extent是那种继承方式
九、讲一下let const var
十、讲一下flexbox
十一、讲一下float
十二、移动端适配
1三、promise定义及应用
二面
一、介绍项目，项目中每个点追着细问
二、https实现
三、跨域等问了几个基础问题
HR
一、聊人生、聊计划、周围以为厉害的人，影响较大的人、本身的缺点、最近集中面试对你有什么影响
二、建议：增长只是探索欲及主动性会对之后工做有很好的发展。

携程

1.对js闭包的理解
2.对原型的理解
3.js怎么实现继承
4.angular的双向绑定实现
5.其余框架的双向绑定实现
6.对链表和二叉树的理解
7.链表和数组插入的效率
8.快速排序的原理
9.快速排序的时间复杂度和空间复杂度
10.组合和继承的关系，哪一个好用
11.组合和继承的例子

//终面
1.项目介绍
2.前端和后端的区别和分工
3.对前端渲染和后端渲染的见解
服务端的计算和渲染效率比较高，可是服务端渲染返回的页面就须要刷新页面，用户体验很差
4.更喜欢哪种为何
5.对先后端联合渲染有了解吗
6.为何技术选型angularjs
7.为何要重构代码
8.重构代码的流程
9.具体一个控制器是怎么重构的
10.写一个深度拷贝函数
11.怎么完成一个提交订单页面

美团

一、三栏式布局 margin float flexbox
二、行内元素性质 (非替换元素不可设置高度和margin-top,margin-bottom)
三、清除浮动(clear:both overflow:hidden :after{content:' ';height:0;clear:both})
四、angular双向绑定、vue双向绑定(get set)
五、浏览器缓存两种方式
六、屏幕适配布局：rem
七、http状态码
八、不使用缓存方式：在请求路径后面加rand随机数
九、image原生布局为inline
原生属性查看方式：var myDiv=document.getElementsByTagName("img")[0];
console.log(document.defaultView.getComputedStyle(myDiv,null));

总结主要问css和框架原理以及一些浏览器原理

一、自我介绍
二、bootstrap 布局，栅格布局 ，怎么处理不一样设备上的差别
三、http 304 状态码是什么意思？其余状态码？HTTPS
四、ajax跨域，有哪些解决方法，举了几个实例让实现跨域，访问子域算不算跨域等等等
五、一两个简单的算法题（记不清了）
六、求数组中最大数
七、事件委托，点击 ul 中的li 弹出li内容，动态添加li
八、原型链继承：    b.prototype =new a() 不对吗？ 
九、es6 ，异步缘由，promise set map等等
十、事件流 
十一、cookie
十二、数组去重
1三、项目

 拼多多

1.两栏布局，左边固定，要求先加载内容区域，说出多种方法
2.正则对象test方法和exec方法的不一样，分别返回什么
3.事件绑定的多种方式，事件监听addEventListener的第三个参数是什么，取值各有什么意思
4.事件代理 阻止事件冒泡(stopPropagation cancelBubble) 阻止事件默认方式
5.js基本数据类型有哪些，写一个函数判断变量的类型
6.详细说说box-sizing属性取值的区别
box-sizing: content-box|border-box|inherit;
宽度和高度分别应用到元素的什么位置。
7.有一段文字，里面有电话号码，电话号码是连续数字，须要把电话号码都替换成*，说出多种作法
var reg=/1[3 4 5 8]\d{9}/g;
1）str.replace(reg,'***********')
2）str.split(reg).join('***********')
3） var str1='';
var lastIndex=0;
while(arr=reg.exec(str)){//arr.index内容所在位置
str1+=str.slice(lastIndex,arr.index)+'***********';
lastIndex=reg.lastIndex;//正则表达式当前所在位置（在选中内容以后）
}
str1+=str.slice(lastIndex);
console.log(str1)
8.Header 头 Set-cookie: http-only 是干什么用的？

二面（2017.08.24，25min）
1.自我介绍
2.讲讲你作过的项目
3.项目中提到了 React，问：React 组件的生命周期？父子组件之间如何通讯？子组件之间如何通讯？
4.前端性能优化？
5.http 缓存原理？(Expires Cache-Control if-Modified-Since/last-Modified if-None-Match/ETag)
6.JavaScript 的垃圾回收机制？
7.CSS BFC 原理？
8.box-sizing 属性（两种盒子模型）？
9.稳定的排序和不稳定的排序？
快速排序的思路？
堆排序的思路？
10.还有什么想问个人？

一、自我介绍
二、js继承原理
三、闭包，经典闭包问题for循环i，实现指定输出
四、状态码 499 client has closed connection
五、http有哪几种请求的方法，options做用
六、CROS方法实现跨域
1）Access-Control-Allow-Origin
该字段是必须的。它的值要么是请求时Origin字段的值，
要么是一个*，表示接受任意域名的请求。
2）Access-Control-Request-Method
该字段是必须的，用来列出浏览器的CORS请求会用到哪些
HTTP方法，上例是PUT,GET,POST。
3）Access-Control-Expose-Headers
该字段可选。CORS请求时，XMLHttpRequest对象的
getResponseHeader()方法只能拿到6个基本字段：
Cache-Control、Content-Language、Content-Type、
Expires、Last-Modified、Pragma。若是想拿到其余字段，
就必须在Access-Control-Expose-Headers里面指定。
上面的例子指定，getResponseHeader('FooBar')能够返回
FooBar字段的值。
七、项目介绍，微信免登录怎么实现
八、angular和vue区别
九、手写多路归并排序
十、前端性能优化？具体怎么实现的，用过哪些
十一、sessionStorage和localStorage的不一样

一、自我介绍
二、项目介绍，vue优势
三、盒子模型，怎样在标准盒子模型中实现IE盒子模型
四、知道哪些排序算法，手写快排，时间复杂度
五、怎样知道一个元素在当前屏幕 getBoundingClientRect
六、实现空心圆，里面白色，外面红色(伪元素、border、radial-gradient)
七、有三个函数，内部实现都是异步的，怎么让这三个函数变成一个同步的，以节省时间
--promise.all

一、自我介绍
二、对拼多多有了解吗，使用过吗，了解工做机制吗
三、为何想从事电商，为何选前端开发
四、有没有面过其余公司，有没有拿到其余公司的 Offer？
四、对工资有什么要求吗
五、家庭成员，父母赞成去上海吗
六、保研的仍是考研的，研究生成绩怎么样
七、有男友吗
八、之后生活规划。。。

阿里文娱

一面：一、==的类型强制转换（0=='0'） 3.0===3.0*1 变量提高 变量的命名原则 不一样数据类型值的相互转化二、css3新特性三、ul列表，设置前三列颜色不一样，4-10列斑马线布局，以后元素隐藏四、元素隐藏方式 1）display:none 2）visibility:hidden 3）background-color=color 4）移出视口 position:absolute left float+margin-left 5）z-index:-1;五、变量以什么开头问题六、ES6新特性 七、判断数据类型的方式 1）typeof 2）instanceof 3）Object.prototype.toString.call();八、MVC MVP MVVM区别二面和HR（两个面试官一块儿面的）；九、项目介绍十、为何选择前端十一、用js写Ajax十二、状态码1三、界面有大量的图片，怎样去加快加载时间1四、怎样使用缓存1五、两栏式布局实现1六、怎样修改一个单选或复选框的样式1七、跨域的方式1八、浏览器兼容（我说了绑定事件的）1九、怎样去除字符串中空格，正则表达式能够应用于哪些方面20、压缩js和css文件的原理2一、闭包及应用2二、jquery语法2三、表述能力怎么样，若是没有任何工具，只口述介绍你的项目2四、但愿再怎样环境工做，或对工做环境有什么要求2五、最近吵过架吗？赢了仍是输了（不知道意图何在）2六、有什么问题问个人吗（一面也有问）