小菜雞?面試の初體驗，自閉路上漸行漸遠......?‍♂️

BB小天使發表於2020-02-29
面試

前言

本人現在大三菜雞，想在暑期找一份實習鍛鍊鍛鍊自己，所以也去投了一下簡歷試了試面試emmm感覺自己還是太菜了嗚嗚嗚，真的還得加強一下自己才行，特別是演算法方面，太吃虧了嗚嗚嗚。大家最近趕快投！！提前批！掛了也不會計入系統！以後再努力努力！！衝鴨！！

有興趣可以看看俺整理的知識點或許有所幫助呢~祝大家早日實習上岸！！！ juejin.im/post/5e5a75…

順便安利一下小專案~嘻嘻嘻，希望走過路過給個star！

由衷感謝 CVTE 讓俺獲得人生中第一個offer嗚嗚嗚

總結

  • 提前總結一下吧，這些面試讓我感覺到emmm，他們都比較重視計算機網路，網路安全，框架原理方面的知識，HTTP協議，TCP握手，各種網路方面的東東...... 啊好多好多啊基礎部分，每次都能問到新的不會的東東，爆哭

  • 總之吧emmm還是基礎得打好，框架原理還有node方面也需要重視。然後面試官會審視簡歷，大多會根據簡歷來問。所以不熟的沒把握的千萬不要寫在簡歷上！！！

  • 其次就是如果有自己的小專案就最好啦，面試官基礎部分了解過後就會對專案進行提問啊，問問有什麼亮點，自己遇到的難點，如何解決。他們很重視解決問題的能力。不過如果專案有明顯的的不合理的地方或者不足，他們就會抓出來進行提問，問你將來怎麼解決的之類的。

  • 一般會問你是如何學習前端的，然後最近在看什麼文章，最近在瞭解什麼新的知識熱點等等，平時的積累也是挺重要的，然後也會根據你說的內容來進行提問，所以有能力的話也可以檢視引導面試官來提問你擅長的地方哈哈哈哈（手動狗頭）

問的東西都偏向於基礎，然後慢慢昇華一下，到專案，到思維擴充套件，實際情景的應用等等。面經內容不全，大概就是這些吧！！哈哈哈湊活著看看！或許有幫助！有些東東不方便透露太多，大多都是基礎，大噶多背背就行啦！

CVTE 一面（過）

電面，面試官很和藹hhhh，全程都是以聊天的方式進行下去，問了一下專案也給了一些意見。哈哈哈哈印象最深的就是一直問我覺得自己哪裡牛逼哪裡牛逼hhhh

  1. 主要還是問了專案
  2. js基礎
  3. 計算機網路

CVTE 二面（過）

視訊面，這一面還是有點緊張的，突然看見一個戴著口罩的小帥哥，但就聊了聊，然後還是主要說的專案，然後針對專案的功能問了幾個問題，也發現幾個不足的地方，提出了挺多的建議的，很感謝這個面試官，看我做不出來演算法題也很有耐心給我指導，感動，有一些細節的地方，深入理解的部分，見到我不會也不會為難我，就大概跟我解釋一下，很棒！

  1. 主要也還是問了專案
  2. 瀏覽器相關（快取，儲存）
  3. 實際情景題
  4. 演算法題
// 根據例項輸入輸出矩陣規律完成以下 matrix 函式：
function matrix(n) {

}

matrix(n).forEach((item, i) => {
    console.log(item);
});


// 示例 1
// 輸入: 3 or 4
// 輸出: 
// [ 0, 2, 0 ]
// [ 2, 1, 2 ]
// [ 0, 2, 0 ]

// 示例 2
// 輸入: 5 or 6
// 輸出: 
// [ 0, 0, 3, 0, 0 ]
// [ 0, 3, 2, 3, 0 ]
// [ 3, 2, 1, 2, 3 ]
// [ 0, 3, 2, 3, 0 ]
// [ 0, 0, 3, 0, 0 ]

// 示例 3
// 輸入: 7 or 8
// 輸出: 
// [ 0, 0, 0, 4, 0, 0, 0 ]
// [ 0, 0, 4, 3, 4, 0, 0 ]
// [ 0, 4, 3, 2, 3, 4, 0 ]
// [ 4, 3, 2, 1, 2, 3, 4 ]
// [ 0, 4, 3, 2, 3, 4, 0 ]
// [ 0, 0, 4, 3, 4, 0, 0 ]
// [ 0, 0, 0, 4, 0, 0, 0 ]
複製程式碼

還是演算法吃虧，這題沒有寫出來，面試官給了點思路，提示只需要搞定四分之一，然後可以進行翻轉，雖然提示了，但還是做不出哈哈哈，面試完之後試了試才做出來（感謝面試官不掛之恩！）

以下是根據面試官給的提示做出來噠，就是先算好四分之一，然後進行翻轉拼接

function matrix(n) {
  // 求長度
  let len = Math.ceil(n / 2)
  let arr = Array.from({ length: len }, _ => Array.from({ length: len }, __ => 0))
  let temp = null
  // 算出四分之一的矩陣
  for (let i = 0; i < len; i++) {
    for (let j = 0; j < len; j++) {
      if (i + j >= len - 1) {
        arr[i][j] = len * 2 - i - j - 1
      }
    }
  }
  // 水平翻轉，搞定上半部分
  for (let row = 0; row < len; row++) {
    temp = [...arr[row]].reverse().splice(1)
    arr[row] = arr[row].concat(temp)
  }
  // 垂直拼接
  temp = [...arr].reverse().splice(1)
  arr = arr.concat(temp)
  return arr
}
複製程式碼

位元組跳動 （感謝信get√）

視訊面，還是演算法吃了大虧嗷，全程題面，然後解釋各種知識點，提問等，演算法給了提示還是做不出來，唉，太蠢了
（為什麼還不給我感謝信！！！讓我有種錯覺可以被撈！！！）

是在官網投的日常實習生，也不知道是不是因為不是內推的原因，自己感覺必掛了，但感謝信遲遲不到，爆哭，好歹嗚嗚嗚我也...努力過嘛，哭（啊，演算法！洗內！）

大概記得的就這些主要的吧

  1. block元素水平垂直居中

這裡我採用了兩種，一種是translate + absolute，另一種是在修改body樣式用flex，這裡注意一定要把body的height設定為100vh不然會垂直居中不了

<body>
    <div class="block"></div>
</body>
複製程式碼
  1. 讀程式碼解釋原因，然後說出瀏覽器事件迴圈與node事件迴圈等知識點
console.log('begin')
setTimeout(() => {
  console.log('setTimeout 1')
  Promise.resolve().then(() => {
    console.log('promise 1')
    setTimeout(() => {
      console.log('setTimeout2 between promise1&2')
    })
  }).then(() => {
    console.log('promise 2')
  })
}, 0)
console.log('end')

// 答案是
/*
  begin
  end
  setTimeout 1
  promise1
  promise2
  setTimeout2 between promise1&2
*/
複製程式碼
  1. 實現求和（柯里化）
sum(1)(2)(3).sumOf() // 6
sum(1, 2)(3).sumOf() // 6
sum(1, 2, 3).sumOf() // 6

// 一下為答案
function curry() {
  let argsList = [...arguments]
  let fn = function () {
    argsList.push(...arguments)
    return fn
  }

  fn.sumOf = () => argsList.reduce((a, b) => a + b)

  return fn
}

let sum1 = curry()
let sum2 = curry()
let sum3 = curry()

console.log(sum1(1, 2, 3).sumOf())
console.log(sum2(1)(2)(3).sumOf())
console.log(sum3(1, 2)(3).sumOf())
複製程式碼
  1. 讀程式，並解釋為什麼，然後說一下上下文之類的各種知識

這裡被坑了，沒有注意到函式傳了一個a進去哈哈哈哈，然後說成了9 18 27，尷尬~

var result = []
var a = 3
var total = 0
function foo(a) {
  var i = 0
  for (; i < 3; i++) {
    result[i] = function () {
      total += i * a
      console.log(total)
    }
  }
}

foo(1)
result[0]()
result[1]()
result[2]()

// 答案是 3 6 9
複製程式碼
  1. 演算法，實現全排列
輸入"abc"返回他的全排列組合

以下為答案
var permute = function (nums) {
  let path = []
  let visited = Array.from({ length: nums.length }, _ => false)
  let res = []
  DFS(nums, 0, nums.length, path, visited, res)
  return res
};

var DFS = function (nums, curSize, len, path, visited, res) {
  if (curSize === len) {
    res.push([...path])
    return
  }

  for (let i = 0; i < len; i++) {
    if (!visited[i]) {
      visited[i] = true
      path.push(nums[i])
      DFS(nums, curSize + 1, len, path, visited, res)
      visited[i] = false
      path.pop()
    }
  }
}
複製程式碼
  1. 智力題：A,B拋硬幣，正面贏，A先手，A贏得概率是多少

這個完全懵逼嗷，大家覺得是多少呢！

阿里 - 不知名部門（暴斃）

電面，這個十分可惜，還沒開始準備直接暴斃

  1. React原理
  2. cookie的屬性
  3. localStorage和sessionStorage的區別
  4. localStorage能跨域嗎
  5. 重繪和迴流
  6. httponly
  7. csrf 和 xss

阿里釘釘 - 主要為小程式（不合適）

視訊面，主要聊了專案，然後問了比較多網路，以及安全的問題，團隊主要是做小程式的，問了挺多小程式的東東，直接懵逼，主管還是猛嗷嗚嗚嗚

  1. 小程式原生api
  2. https加密原理
  3. 好的登入態的實現
  4. React的優勢
  5. setState之後發生了什麼
  6. React效能優化
  7. hook的原理（如何實現）
  8. 小程式執行池
  9. 微信瀏覽器有什麼區別
  10. Taro編譯的原理
  11. 事件代理（捕獲階段可以嗎）
  12. React的事件委託到哪

阿里CBU（初面）

電面，感覺怪凶的哈哈哈，前面問的好好的，突然問起了Vue瞬間暴斃，原來是看到我簡歷上描述有個專案使用Vue開發所以問，以後一定不能吧這些不熟悉的放在簡歷上了！

  1. 事件委託
  2. 深淺拷貝的區別
  3. Object.assign
  4. BFC
  5. Fiber
  6. virtual dom
  7. diff演算法
  8. hook
  9. webpack流程
  10. webpack打包出來的js的結構，內容是什麼
  11. babel編譯原理
  12. node的優勢
  13. node中，async/await，generator，promise的區別，聯絡
  14. 多使用者來訪問聊天伺服器，你有1000臺伺服器，應該怎麼辦（坑啊）
  15. Vue雙向繫結如何實現
  16. Vue資料流
  17. Vue與React的區別
  18. 一堆Vue.... (還說了句，你不會的還往簡歷上寫？以後不敢了！哭)

阿里飛豬（初面）

電面，這個是聊得最久的嗚嗚嗚，手機都燙了！面試官很好人，emmm就真的很棒棒，全程不會刁難你的那種，不會咄咄逼人，就一直引導你思考，然後問道深入的點，不會的話他也會說沒關係~感興趣的話去了解了解就行了，十分nice啊。
最後根據專案聊了很多也，然後給了很多建議，指出有些地方還可以改進改進，然後我也厚著臉皮問了問之前面試官問我的一到開放題。沒想到他竟然給我分享了好多好多種辦法，真的太感動了，真的好強好厲害，很詳細的告訴以後往什麼方向去做，然後如何去思考，如何去實現，最後花了挺長時間來介紹他們的部門，真的很棒！

  1. 輸入url到頁面渲染展示
  2. DNS如何解析
  3. 輸入域名如何轉換為ip地址，然後轉到伺服器
  4. gzip原理
  5. cookie localStorage sessionStorage
  6. cookie與token的本質區別（session）
  7. 閉包 及其常見的應用場景
  8. 快取
  9. 強快取如何存
  10. 過期時間等引數瀏覽器是如何獲取的
  11. 伺服器如何設定快取設定頭
  12. 快取的場景
  13. call apply區別
  14. React的事件機制
  15. virtual dom
  16. hooks的優勢，為何被喜歡，常用的方式
  17. React資料流
  18. HOC，優勢及其常用方式
  19. setState獲取更新的值
  20. csrf 和 xss
  21. flex佈局，及你常用的方式，相容性
  22. 前端效能優化（你用過的）
  23. node非同步的歷史（答了async/await, generator）
  24. webpack流程
  25. webpack-dev-server原理
  26. webpack配置項與常用外掛
  27. ES6的語法，及你常用的
  28. Mobx的原理
  29. 盒模型與怪異盒模型
  30. HTTP報文結構，請求頭有啥，響應頭有啥
  31. 最近看什麼書，看什麼文章，打算考研嗎
  32. 棧，佇列
  33. 10萬個數字找最大的K個數（描述了快排，及如何實現，時間複雜度，最好，最差的情況下）
  34. DFS與BFS，如何實現
  35. 小程式與H5的區別，商業性、技術性（小程式有自己獨立的保護機制，獨立執行在一個地方，不會破壞現有生態）
  36. nginx怎麼配置
  37. 阿里雲dns怎麼配置解析（A？TXT？）
  38. 箭頭函式和普通函式
  39. 按鈕設定監聽用箭頭函式this指向哪
  40. jwttoken
  41. 伺服器開啟服務（nohup，pm2）
  42. Taro編譯原理
  43. typescript優勢，為何收到推崇

阿里雲

  1. flex
  2. 移動端適配
  3. React hook
  4. React優勢
  5. 為什麼選擇React
  6. React資料流
  7. 單向資料流與雙向繫結有什麼區別
  8. 輸入url到頁面展示發生了什麼（查快取先還是dns解析先）
  9. http狀態碼
  10. git的tag，常用什麼指令
  11. npm版本（a.b.c）
  12. webpack功能
  13. webpackloader和plugin有什麼區別
  14. es6的class
  15. 繼承
  16. typescript，正規化
  17. async/await 與 promise （聯絡，區別）
  18. express 和 koa
  19. 中介軟體的區別
  20. 為什麼用koa，express不好嗎
  21. 資料庫用的什麼
  22. sql語句（外連線，內連線有什麼區別）
  23. N個數字，取最大的K個數，有什麼方法，時間複雜度，空間複雜度，用堆
  24. 用了什麼開源的庫，比較火的
  25. 加快渲染
  26. 如何獲得頁面載入的時間
  27. 為什麼選擇Taro，Taro優勢
  28. 怎麼開發一個webpack外掛
  29. 怎麼開發一個npm元件

騰訊（撈錯了...）

啊，暴斃，在官網投的web前端，結果發來的邀請函卻是後臺開發，啊雖然被撈起來很開心，但是嗚嗚嗚不是期望的崗位鴨！哭

相關文章