面試分享：1 年經驗初探前端社招

本文首發於 個人Github。

年中決定離開當前所在的公司，想受一受外面社會的毒打。也面了 2 家還不錯的公司（字節跳動 和 拼多多），在此記錄分享一下。

字節跳動

字節跳動的技術面試都是以視頻面試的形式進行的。

第 1 輪

1.1 自我介紹

1.2 js 基本知識

主要考察 js 中的基本類型、typeof 和 instanceof 等。

1.3 == 和 === 判斷

常規的類型比較題，比較基礎。

[] == false
false == false
[1] == [1];
1 === "1";
複製代碼

1.4 手寫 debounce 函數

function debounce(func, wait, immediate) {
  let timeout;

  const debounced = function() {
    const context = this;
    const args = arguments;
    const later = function() {
      timeout = null;
      if (!immediate) {
        func.apply(context, args);
      }
    };
    const callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
    if (callNow) {
      func.apply(context, args);
    }
  };

  debounced.cancel = () => {
    clearTimeout(timeout);
  };

  return debounced;
}
複製代碼

1.5 從輸入 URL ，瀏覽器發生了什麼

1.6 手寫繼承（ES五、ES6）

1.7 算法題：js 計算 四則運算 字符串 "1 + 2 * 3 + 3 / 3"

第 2 輪

2.1 談談對 Vue 和 React 的理解

2.2 vue 爲何繼續使用 react 廢棄的 mixin 機制

2.3 js 怎麼進行性能分析

2.4 通用組件 和 業務組件 怎麼設計

2.5 webpack 打包優化

2.6 兩個進程之間如何通訊？子網掩碼有什麼做用？

忽然問到了 操做系統 和 計算機網絡 的知識（忘光光）。

2.7 HTTP 狀態碼 204 和 304 之間的區別

2.8 實現 sum 函數

sum(1) == 1;
sum(1)(2) == 3;
sum(1)(2, 3, 4)(5) == 15;
複製代碼

注意這道題考的仍是 隱式轉換。

function sum(...args) {
  let value = 0;

  function innerSum(...args) {
    value = args.reduce((a, c) => (a += c), value);
    return innerSum;
  }

  innerSum.valueOf = function() {
    return value;
  };

  return innerSum(...args);
}
複製代碼

2.9 package.json 中的依賴是怎麼進行版本控制的

2.10 算法題：js 數組三數之和

第 3 輪

3.1 以前工做作過的項目挑一個介紹

這道題注意考察對總體項目的理解和把握程度。

1. 項目背景
2. 項目如何進行的，進行過程當中遇到了哪些問題以及如何解決
3. 項目如何保證代碼質量（單元測試、代碼規範、提交規範以及自動 CI 等）
4. 項目的版本控制

3.2 Vue 的響應式原理

3.3 React 中的高階組件是什麼？

主要考察 HOC，舉出寫過哪些高階組件，有什麼做用便可。

3.4 手寫觀察者模式

拼多多

第 1 輪

1.1 自我介紹

1.2 以前作過的項目介紹

1.3 js 中 break、continue、return 關鍵字區別

1.4 js 有哪些數據類型

1.5 window 對象下面有哪些屬性

1.6 html property 和 attribute 區別

1.7 es6 中 數組方法有哪些？

1.8 es6 新增的數據結構有哪些？有什麼區別？

1.9 css 盒模型有哪些？不一樣點？

1.10 css 如何清除浮動？原理是什麼？

1.11 css BFC 是什麼？

1.12 webpack 如何作優化（例如構建速度優化、代碼優化之類的）

1.13 如何寫 webpack 插件？

1.14 webpack 中的 loader 是如何實現的？（例如 vue-loader）

1.15 vuex 的數據模型如何定義，數據模型之間的反作用怎麼寫？

1.16 談一談你對 Vue 和 React 的認識

1.17 rxjs 的一些理解，如何對請求節流

1.18 瞭解哪些前端新技術

第 2 輪

多是 1 面問了相對太多問題，2 面很輕鬆，也很短暫。

2.1 對 React 和 Vue 的理解

2.2 說一說 React Hooks

2.3 定時器（setTimeout）爲何會不許，如何解決

2.4 聊一聊函數式編程

2.5 聊一聊以前作過的項目

和字節跳動同樣，考察對項目的總體理解和把握能力。

總結

兩家公司的面試難度都不是很大（雖然也多是考慮到我只有 1 年工做經驗），可是回味起來仍是意猶未盡，老是想到上高中時數學老師髮捲子時那痛心疾首的說道 "你看看，多簡單，150 的卷子，至少 120 是基礎題，大家咋就啥都不會呢" 。

最後，但願再過 2 年，能夠去阿里。