网上的面试题一大堆，鱼龙混杂，一方面多数题目质量不高，另一方面有答案的很少，即使拿到面试题对自己的帮助也不大。
最近我花了一些时间，为大家整理了2020年各一、二线互联网公司的前端面试题，内容包括JavaScript、算法、网络&安全、Vue、React等大量的前端知识点和相关面试题。答案和解析也整理在文中了，整理不易，麻烦各位走过路过的壮士给颗star，如果可以star fork watch三连更好，感谢😄 🙏
因篇幅太长，本文收录前50道，后50道将在下篇更新，欢迎关注。
1.写一个 mySetInterVal(fn, a, b),每次间隔 a,a+b,a+2b 的时间，然后写一个 myClear，停止上面的 mySetInterVal
公司：头条
分类：JavaScript
2.合并二维有序数组成一维有序数组，归并排序的思路
公司：头条
分类：算法
3.斐波那契数列
公司：腾讯、CVTE、微软
分类：算法
4.字符串出现的不重复最长长度
公司：腾讯
分类：算法
5.介绍chrome 浏览器的几个版本
公司：滴滴
分类：网络&安全
6.React 项目中有哪些细节可以优化？实际开发中都做过哪些性能优化
公司：滴滴、掌门一对一、网易、有赞、沪江、喜马拉雅、酷家乐、快手
分类：React
7.react 最新版本解决了什么问题 加了哪些东西
公司：滴滴
分类：React
8.说一下 Http 缓存策略，有什么区别，分别解决了什么问题
公司：滴滴、头条、网易、易车、脉脉、掌门一对一、虎扑、挖财、爱范儿
分类：网络&安全
9.介绍防抖节流原理、区别以及应用，并用JavaScript进行实现
公司：滴滴、虎扑、挖财、58、头条
分类：JavaScript、编程题
10.前端安全、中间人攻击
公司：滴滴
分类：网络&安全
前端刷题神器
扫码进入前端面试星球🌍，解锁刷题神器，还可以获取800+道前端面试题和一线常见面试高频考点。
11.对闭包的看法，为什么要用闭包？说一下闭包原理以及应用场景
公司：滴滴、携程、喜马拉雅、微医、蘑菇街、酷家乐、腾讯应用宝、安居客
分类：JavaScript
12.css 伪类与伪元素区别
公司：滴滴
分类：Css
13.有一堆整数，请把他们分成三份，确保每一份和尽量相等（11，42，23，4，5，6 4 5 6 11 23 42 56 78 90）
公司：滴滴
分类：算法
14.实现 lodash 的_.get
公司：滴滴
分类：JavaScript
15.实现 add(1)(2)(3)
公司：滴滴
分类：JavaScript
16.实现链式调用
公司：滴滴
分类：JavaScript
17.React 事件绑定原理
公司：滴滴、沪江
分类：React
18.类数组和数组的区别，dom 的类数组如何转换成数组
公司：海康威视
分类：JavaScript
19.webpack 做过哪些优化，开发效率方面、打包策略方面等等
公司：滴滴、快手、掌门一对一、高思教育
分类：工程化
20.说一下事件循环机制(node、浏览器)
公司：滴滴、伴鱼、高德、自如、虎扑、58
分类：Node、JavaScript
21.如何封装 node 中间件
公司：滴滴、酷狗
分类：Node
22.node 中间层怎样做的请求合并转发
公司：易车
分类：Node
23.介绍下 promise 的特性、优缺点，内部是如何实现的，动手实现 Promise
公司：滴滴、头条、喜马拉雅、兑吧、寺库、百分点、58、安居客
分类：JavaScript、编程题
24.实现 Promise.all
Promise.all = function (arr) {
// 实现代码
};公司：滴滴、头条、有赞、微医
分类：JavaScript、编程题
25.React 组件通信方式
公司：滴滴、掌门一对一、喜马拉雅、蘑菇街
分类：React
26.redux-saga 和 mobx 的比较
公司：掌门一对一
分类：React
27.说一下 react-fiber
公司：头条、滴滴、菜鸟网络、挖财、喜马拉雅
分类：React
28.手写发布订阅
公司：滴滴、头条
分类：JavaScript
29.手写数组转树
公司：滴滴
分类：JavaScript
30.手写用 ES6proxy 如何实现 arr[-1] 的访问
公司：滴滴
分类：JavaScript
31.请写出下面代码执行的的结果
console.log(1);
setTimeout(() => {
console.log(2);
process.nextTick(() => {
console.log(3);
});
new Promise((resolve) => {
console.log(4);
resolve();
}).then(() => {
console.log(5);
});
});
new Promise((resolve) => {
console.log(7);
resolve();
}).then(() => {
console.log(8);
});
process.nextTick(() => {
console.log(6);
});
setTimeout(() => {
console.log(9);
process.nextTick(() => {
console.log(10);
});
new Promise((resolve) => {
console.log(11);
resolve();
}).then(() => {
console.log(12);
});
});分类：JavaScript
31.写出执行结果
function side(arr) {
arr[0] = arr[2];
}
function a(a, b, c = 3) {
c = 10;
side(arguments);
return a + b + c;
}
a(1, 1, 1);分类：JavaScript
32.写出执行结果
var min = Math.min();
max = Math.max();
console.log(min < max);分类：JavaScript
33.写出执行结果,并解释原因
var a = 1;
(function a () {
a = 2;
console.log(a);
})();
分类：JavaScript
34.写出执行结果,并解释原因
var a = [0];
if (a) {
console.log(a == true);
} else {
console.log(a);
}分类：JavaScript
35.写出执行结果,并解释原因
(function () {
var a = (b = 5);
})();
console.log(b);
console.log(a);分类：JavaScript
36.写出执行结果,并解释原因
var fullname = 'a';
var obj = {
fullname: 'b',
prop: {
fullname: 'c',
getFullname: function() {
return this.fullname;
}
}
};
console.log(obj.prop.getFullname()); // c
var test = obj.prop.getFullname;
console.log(test()); // a分类：JavaScript
37.写出执行结果,并解释原因
var company = {
address: 'beijing'
}
var yideng = Object.create(company);
delete yideng.address
console.log(yideng.address);分类：JavaScript
38.写出执行结果,并解释原因
var foo = function bar(){ return 12; };
console.log(typeof bar()); 分类：JavaScript
39.写出执行结果,并解释原因
var x=1;
if(function f(){}){
x += typeof f;
}
console.log(x)分类：JavaScript
40.写出执行结果,并解释原因
function f(){
return f;
}
console.log(new f() instanceof f);分类：JavaScript
41.写出执行结果,并解释原因
var foo = {
bar: function(){
return this.baz;
},
baz:1
}
console.log(typeof (f=foo.bar)());分类：JavaScript
42.说一下React Hooks在平时开发中需要注意的问题和原因？
43.Vue组件中写name选项有除了搭配keep-alive还有其他作用么？你能谈谈你对keep-alive了解么？（平时使用和源码实现方面）
分类：Vue
44.Vue 为什么要用 vm.$set() 解决对象新增属性不能响应的问题 ？你能说说如下代码的实现原理么？
Vue.set (object, propertyName, value)
vm.$set (object, propertyName, value)分类：Vue
45.既然 Vue 通过数据劫持可以精准探测数据在具体dom上的变化,为什么还需要虚拟 DOM diff 呢?
分类：Vue
分类：Vue
46.下面代码输出什么？
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1);
}分类：JavaScript
47.写出执行结果,并解释原因
const num = {
a: 10,
add() {
return this.a + 2;
},
reduce: () => this.a -2;
};
console.log(num.add());
console.log(num.reduce());分类：JavaScript
48.写出执行结果,并解释原因
const person = { name: "yideng" };
function sayHi(age) {
return `${this.name} is ${age}`;
}
console.log(sayHi.call(person, 5));
console.log(sayHi.bind(person, 5));分类：JavaScript
49.写出执行结果,并解释原因
["1", "2", "3"].map(parseInt);分类：JavaScript
50.写出执行结果,并解释原因
[typeof null, null instanceof Object]分类：JavaScript
前端刷题神器
扫码进入前端面试星球🌍，解锁刷题神器，还可以获取800+道前端面试题和一线常见面试高频考点。
本文首发微信公众号：前端先锋
欢迎扫描二维码关注公众号，每天都给你推送新鲜的前端技术文章
欢迎继续阅读本专栏其它高赞文章：
- 深入理解Shadow DOM v1
- 一步步教你用 WebVR 实现虚拟现实游戏
- 13个帮你提高开发效率的现代CSS框架
- 快速上手BootstrapVue
- JavaScript引擎是如何工作的？从调用栈到Promise你需要知道的一切
- WebSocket实战：在 Node 和 React 之间进行实时通信
- 关于 Git 的 20 个面试题
- 深入解析 Node.js 的 console.log
- Node.js 究竟是什么？
- 30分钟用Node.js构建一个API服务器
- Javascript的对象拷贝
- 程序员30岁前月薪达不到30K，该何去何从
- 14个最好的 JavaScript 数据可视化库
- 8 个给前端的顶级 VS Code 扩展插件
- Node.js 多线程完全指南
- 把HTML转成PDF的4个方案及实现
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。