2020最新：100道有答案的前端面試題（上）
網上的面試題一大堆，魚龍混雜，一方面多數題目質量不高，另外一方面有答案的不多，即便拿到面試題對本身的幫助也不大。css
最近我花了一些時間，爲你們整理了2020年各1、二線互聯網公司的前端面試題，內容包括JavaScript、算法、網絡&安全、Vue、React等大量的前端知識點和相關面試題。答案和解析也整理在文中了，整理不易，麻煩各位走過路過的壯士給顆star，若是能夠star fork watch三連更好，感謝😄 🙏前端
因篇幅太長，本文收錄前50道，後50道將在下篇更新，歡迎關注。node
1.寫一個 mySetInterVal(fn, a, b),每次間隔 a,a+b,a+2b 的時間，而後寫一個 myClear，中止上面的 mySetInterVal
公司：頭條react
分類：JavaScriptwebpack
答案&解析git
2.合併二維有序數組成一維有序數組，歸併排序的思路
公司：頭條程序員
分類：算法github
答案&解析web
3.斐波那契數列
公司：騰訊、CVTE、微軟面試
分類：算法
4.字符串出現的不重複最長長度
公司：騰訊
分類：算法
5.介紹chrome 瀏覽器的幾個版本
公司：滴滴
分類：網絡&安全
6.React 項目中有哪些細節能夠優化？實際開發中都作過哪些性能優化
公司：滴滴、掌門一對1、網易、有贊、滬江、喜馬拉雅、酷家樂、快手
分類：React
7.react 最新版本解決了什麼問題 加了哪些東西
公司：滴滴
分類：React
8.說一下 Http 緩存策略，有什麼區別，分別解決了什麼問題
公司：滴滴、頭條、網易、易車、脈脈、掌門一對1、虎撲、挖財、愛範兒
分類：網絡&安全
9.介紹防抖節流原理、區別以及應用，並用JavaScript進行實現
公司：滴滴、虎撲、挖財、5八、頭條
分類：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 作過哪些優化，開發效率方面、打包策略方面等等
公司：滴滴、快手、掌門一對1、高思教育
分類：工程化
20.說一下事件循環機制(node、瀏覽器)
公司：滴滴、伴魚、高德、自如、虎撲、58
分類：Node、JavaScript
21.如何封裝 node 中間件
公司：滴滴、酷狗
分類：Node
22.node 中間層怎樣作的請求合併轉發
公司：易車
分類：Node
23.介紹下 promise 的特性、優缺點，內部是如何實現的，動手實現 Promise
公司：滴滴、頭條、喜馬拉雅、兌吧、寺庫、百分點、5八、安居客
分類：JavaScript、編程題
24.實現 Promise.all
Promise.all = function (arr) {
// 實現代碼
};
公司：滴滴、頭條、有贊、微醫
分類：JavaScript、編程題
25.React 組件通訊方式
公司：滴滴、掌門一對1、喜馬拉雅、蘑菇街
分類：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個方案及實現
- 1. 最新前端面試題 含答案
- 2. 2018最新Web前端經典面試試題及答案-史上最全前端面試題(含答案)
- 3. 上百道最新前端面試題
- 4. 2020最新Web前端經典面試題及答案
- 5. 2020 最新java面試題附答案
- 6. java最新面試題及答案2020
- 7. 100道最多見的校招前端面試題（更新中）
- 8. 2020前端最新面試題（vue篇）
- 9. 2020年最新前端面試題
- 10. 2020年最新Web前端面試題
- 更多相關文章...
- • MySQL 5.7的新特性（新功能） - MySQL教程
- • 服務器上的 XML - XML 教程
- • PHP Ajax 跨域問題最佳解決方案
- • 使用阿里雲OSS+CDN部署前端頁面與加速靜態資源
-
每一个你不满意的现在，都有一个你没有努力的曾经。