2020最新100道有答案的前端面试题上

40次阅读

共计 4773 个字符,预计需要花费 12 分钟才能阅读完成。

网上的面试题一大堆,泥沙俱下,一方面少数题目品质不高,另一方面有答案的很少,即便拿到面试题对本人的帮忙也不大。

最近我花了一些工夫,为大家整顿了 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. 前端平安、中间人攻打

公司:滴滴

分类:网络 & 平安

答案 & 解析

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 个计划及实现

  • 更多文章 …

正文完
 0