京東前端面試經歷

時間 2019-11-17

標籤京東前端面試經歷欄目快樂工作简体版

原文原文鏈接

京東面試總結

京東面試流程：javascript

1：自我介紹；css

2：技術介紹；前端

3：我的愛好興趣； java

各位面試官問到的技術點node

1：前端的發展；react

2：你說熟悉的框架；webpack

3:2018年你想去學去作的事情；css3

4：ajax的實現原理；git

5:數組中，的重複元素進行去除；es6

6:對es6的瞭解；

7:前拷貝，深拷貝；怎樣對一個對象進行深拷貝；

8：react是否瞭解；

9：列舉Jq中經常使用的方法；

10：H五、css3的瞭解，經常使用的元素及屬性；

11：echarts，10個柱狀圖該怎麼處理；

12:說下你最近工做期間瀏覽的網站及書籍名；

13：是否有本身的技術貼：或github上傳分享的項目；

14：對字符串進行拼接的幾種方法；

面試官：

公司項目組分移動端與pc端；

移動端大概7人；

主要用到的技術react,

前端面試&滴滴實習心得

莫凡

4 個月前

原文地址在個人博客, 轉載請註明出處，謝謝！

從大二下學期放暑假開始（7.14）到8月初，我一直在尋找一份實習，鍛鍊一下本身，看看學的怎麼樣。這期間，我相繼面試了小米、途牛、滴滴和百度，都拿了實習offer。其中百度拿了兩次實習offer，但因爲我自身一些緣由，都爽約了。（在這裏給百度真誠地道個歉，我很是珍視這兩次機會，但無奈遇到了不可抗拒的緣由，從此有機會還會再投的(˶‾᷄ ⁻̫ ‾᷅˵)）最後選擇了在滴滴實習，很可貴的經歷。實習期間一直沒空閒下來分享一下，結果拖到了如今...那麼這篇文章就來分享一下個人面試和實習心得吧

面試

有一些記不清了，畢竟時間過久了...

小米

說一下你的前端學習經歷
css左右邊固定寬，中間自適應，有幾種方案
css3動畫，transition屬性知多少
說說你是如何配置你項目裏的webpack
如何判斷變量是true or false
數組去重，要求時間複雜度爲O(n)
http狀態碼，304什麼狀況
跨域方法
其餘想不起來了...

途牛

typeof 都返回哪些類型 typeof null 返回什麼，爲何？
cookie和session有什麼區別
有沒有實際寫過、解決過跨域相關問題
使用過ES6／7哪些特性
說說 promise 幾個經常使用API和原理
React的特性，接着問原理，接着問好在哪裏
堆和棧的區別
其餘想不起來了...

滴滴

React技術棧作項目用到了哪些東西
React特性、virtual dom、diff 、合成事件、調和等原理
爲啥要給列表類組件設個key?
讀過React源碼嗎？
使用過哪些狀態管理庫，我說Redux，接着問Redux 是如何管理React 的，你又是如何使用Redux架構你的項目的
Redux 有哪些優缺點
瞭解數據可視化嗎？作過之類的東西沒有？
瞭解node嗎
其餘記不起來了...總之都是圍繞React技術棧來問的，上來就問框架很顯然想讓你進來直接幹活：）

百度（地圖事業部）

你在滴滴實習，爲啥要來百度？（blablabla...誇了百度一番）
你在滴滴作什麼東西？用了什麼東西（數據可視化，還用了大家的echarts呢(/ω＼)）
那你知道echarts有哪些能夠優化的地方？讀過它的源碼嗎？
React 特性、原理，React 突出的思想
你是如何使用Redux架構技術棧的
我看你用了Redux-saga，它比thunk、promise有啥好處？
你使用過哪些ES6 新特性、promise原理
跨域的幾種方法
你這個項目有沒有遇到什麼你以爲難的問題，你怎麼解決的？
你有啥想問個人？（通常問部門技術棧、工做氛圍）
其餘記不起來了...

百度（校園品牌部）

介紹一下前端經歷
你日常如何用css管理頁面佈局的，我說柵格，又問柵格怎麼實現的
css3動畫、transition、transform，canvas、svg
sass跟less的區別？
javascript 有哪些特性，我說了弱類型、單線程、事件驅動，就有了下面的
你怎麼理解事件驅動機制的？
用過事件委託嗎？怎麼用的？
嗯...ES6 用過哪些新特性？我提到了箭頭函數，因而就問
箭頭函數跟ES5匿名函數有什麼區別？我提到了this指向，而後就接着問
箭頭函數自動綁定this原理是什麼？
嗯...你這個項目怎麼配置webpack的？用過gulp嗎？webpack跟gulp有啥區別？
React 突出的特性
怎麼用git創建一個遠程分支
Linux命令知多少？
怎麼把一個鏈表倒序？
其餘記不清了....

總結

總的來講，因爲面試的特殊時期，面試難度會比春招實習、校招要低不少。

面試會圍繞你的簡從來問，因此簡歷寫好而且爲簡歷作好準備很重要。

面試大多問的是基礎，並且問的很細，常常圍繞一個點來深挖，還會問一些常常用到的API，因此面試必定要準備，把一些零碎的知識溫習一下，基礎很重要。項目問的比較少，但項目決定你簡歷的質量。

前端要掌握的知識面比較廣，可是有一些是構建工程所必須的，最好先培養本身比較全面的基礎技術棧，能夠足夠造成構建通常工程項目的基本能力，而後再深挖。

照目前狀況來看，深刻理解一門框架是頗有必要的，但也不必多。

前端面試算法問題問的較少(大公司問的較多)，但別告訴我你不知道查找、排序、去重、遍歷二叉樹...

面試必定要保持平和心態，抱着我已經拿到BAT offer的心態，不緊不慢的交談，用眼神、肢體語言幫助嘴巴說話；擇機展現思考的過程，全程展現對這行的熱情。

祝願你們都能找到心儀的實習、工做。

實習

我在滴滴實習了一個多月就走了，緣由是學校課太多，導員不讓出去，我也意識到了如今仍是以學業爲重...

實習期間，我參與了兩個項目，一個是一個滴滴實時計算平臺，另外一個是 Druid 管理平臺。

實時計算平臺，面向滴滴內部工程師，是一個依靠滴滴海量數據完成實時計算、任務調度、自動報警監控等等，項目很大，作了一年了，業界少有吧....我所作的是將我負責的部分數據可視化及國際化；

Druid 管理平臺，仍面向內部工程師，是一個可視化數據庫管理平臺，前端由我和另外一位實習生負責。我作的是一期核心模塊的開發。

最大的體會就是

要對產品有極致追求，不能容忍錯誤，不能容忍繁瑣的操做，還要兼顧全部可能的操做
體會到了海量數據下的性能的重要性，開始關注性能優化
要抱着後臺什麼數據都有可能產生的考慮，來寫健壯的程序，類型檢查、空值檢測、try catch是必要的
作好漸進加強、功能解耦、組件分離很能體現一我的的編程能力和水平，最忌諱代碼粘一塊、寫死，坑的都是本身,,,
調試很重要，要有寫debugger的習慣
時刻準備迎接新技術，哪怕從未據說，只要項目須要，就得馬上上手(我所在的組仍是很喜歡用新技術的，只要它好用，License符合)
先後端分離的接口文檔遵循規範能少說不少廢話
項目管理，敏捷開發是很好的方式
我所在的組開發項目的流程通常是：老大不知道從哪弄來一個需求(可能上級安排的，不少是本身想的…)，而後全員開會說需求、定任務，各成員寫排期，後端定具體需求、接口，前端配合後端一同開始，每週報告任務進展...
對前端er來講，改需求不用那麼在乎，咱們最終的目的都是讓這個產品更好不是嗎？
實習生不多會接觸to C產品，作的大可能是面向內部人員，由於出bug好商量嘛...
我所在的部門女工程師仍是挺多的，這個的確讓我很驚訝(No Offense)...
想到再補充(/ω＼)

此次實習，確實比自學效率高多了，並且最重要的是，開闊了眼界，瞭解了這行業前沿是個什麼狀況，大公司又是如何部署前端技術棧開發項目的，以及我自身的不足。我也很幸運，找到了本身感興趣的方向。

阿里巴巴暑假實習面試總結

Ahonn

1 年前

原文地址：http://www.ahonn.me/2017/03/1...

2月末的時候，經過 SimplyY 內推了阿里巴巴暑期實習的前端開發崗，在此表示感謝。
接着3月1號收到了內推的通知郵件，完善信息後很快就接到了一面的電話（3月3號）。

一面

面試了大概20分鐘左右，總體內容仍是比較偏基礎。一開始是正常流程的自我介紹，說是三分鐘自我介紹，可是我語速比較快的不到兩分鐘的介紹完了。(恰好是臨近中午，本來打算吃飯的，要是去吃飯的話就得在路上面了...）

CSS 垂直居中

這個寫過一篇博文專門總結過，不過面試的時候仍是太過緊張沒有答全。主要是 Flexbox 佈局的垂直居中比較容易忘記。

具體就再也不囉嗦了，詳情能夠查看：CSS 實現垂直居中

call 與 apply 的區別，以及性能差異

call 與 apply 的區別，這是一個老生常談的面試題了。call() 與 apply() 都是用於在指定 this 值與參數的狀況下調用函數，主要的區別在於除了傳入 this 值以外，apply() 接收類數組或者類數組對象來做爲調用的函數的參數，而 call() 則是須要分別傳入函數的每個參數（除第一個參數以外的其餘參數）。

call()方法與apply()方法的做用相同，它們的區別僅在於接收參數的方式不一樣。對於call()方法而言，第一個參數是this值沒有變化，變化的是其他參數都直接傳遞給函數。換句話說，在使用call()方法時，傳遞給函數的參數必須逐個列舉出來。—— 『JavaScript 高級程序設計』

區別的話基本上只要看過書或者刷過面試題都會知道，但 call() 與 apply() 之間的性能差異就不是那麼常見了。
比較幸運的是，以前在閱讀 underscore 源碼的時候有注意到這個細節，爲此也寫過另外的文章：從 optimizeCb 提及。

實踐證實，在知道調用函數的參數數量時，使用 call() 的性能會優於 apply()。主要在實現的過程當中 apply() 須要完成額外的操做（判斷第二個參數類數組的長度，etc.）。具體爲何有這種差異，能夠在 ECMAScript Language Specification 中查看 Function.prototype.apply與 Function.prototype.call 的具體實現差別。

參考連接

什麼是閉包

又是一個老生常談的問題。個人理解比較膚淺，就是 A 函數返回 B 函數，B 函數可以訪問 A 函數中的局部變量，使得在 A 外部的做用域中可以使用 B 函數間接操做 A 函數中的局部變量，這樣就造成了一個閉包。A 函數中的局部變量與返回的 B 函數一同存在，不會被垃圾回收機制清理（引用還存在）。

在計算機科學中，閉包（英語：Closure），又稱詞法閉包（Lexical Closure）或函數閉包（function closures），是引用了自由變量的函數。這個被引用的自由變量將和這個函數一同存在，即便已經離開了創造它的環境也不例外。—— 維基百科

建議閱讀『你不知道的 JavaScript（上卷）』中有關做用域與閉包的部分。

什麼是尾遞歸

在計算機科學裏，尾調用是指一個函數裏的最後一個動做是一個函數調用的情形：即這個調用的返回值直接被當前函數返回的情形。這種情形下稱該調用位置爲尾位置。若這個函數在尾位置調用自己（或是一個尾調用自己的其餘函數等等），則稱這種狀況爲尾遞歸，是遞歸的一種特殊情形。—— 維基百科

通常遞歸實現階乘：

function fact(n) {
  if (n == 0 || n == 1) {
    return 1;
  } else {
    return n * fact(n - 1);
  }
}

通常遞歸須要中棧上維護函數的調用信息直到函數返回後才釋放，容易發生『棧溢出』錯誤。但對於尾遞歸來講，只須要維護一個調用記錄。

尾遞歸實現階乘：

function fact(n) {
  return fact-iter(n, 1);
}

function fact-iter(n, a) {
  if (n == 0) {
    return 1;
  } else if (n == 1) {
    return a;
  } else {
    return fact-iter(n - 1, n * a);
  }
}

關於遞歸與尾遞歸，在『計算機程序的構造和解釋』中也有相似的討論。

React 的設計理念

這部分答得不是很好，只提到了組件化，單向數據流，Virtual DOM 之類的。

有關 React 的設計思想能夠參考這一篇文章：React 設計思想。

前端安全（攻擊方式與如何防範）

第一反應就是 XSS 與 CSRF，XSS 能夠經過對輸入數據進行轉義來防範，而 CSRF 則經過使用 SSL 連接訪問資源或者請求中添加驗證碼來進行防範。

除此以外我漏掉了網絡劫持，控制檯注入代碼等攻擊方式，這裏有篇文章作了詳細介紹：聊一聊WEB前端安全那些事兒。

二面

第一次遠程視頻面試，好緊張。

一開始問了 CSS 中 position 屬性的 absolute 的做用以及應用場景，這個基本上沒有什麼問題。接着叫我拿紙寫冒泡排序（手寫 T-T），飛快的寫完。而後跟一面同樣也問了前端安全相關的問題，一會兒都不緊張了.. 沒有想象中的難。

實現 bind 函數

一樣是讓我寫代碼，一樣是手寫（T-T）。這個問題對我來講不算難，不過只是寫了簡單的實現，沒有考慮其餘狀況。

Function.prototype.bind = Function.prototype.bind || function (context) { var self = this; return function () { return self.apply(context, arguments); } }

基本原理就是使用 apply() 與閉包，返回包含 apply() 的閉包使得 apply() 綁定指定做用域，但並未執行。

閱讀 Underscore 源碼的經歷

以前拖拖拉拉的閱讀完了 Underscore 的源碼，並提交了一個小 Pull Request。

在閱讀的過程當中學到了許多的東西，例如上面提到的 call 與 apply 的性能差異，除此以外還有如何去判斷變量的類型，以及如何判斷兩個變量是否相等，等等。另外也瞭解到許多閉包的使用場景。

閱讀其餘類庫的收穫

除了 Underscore 以外還閱讀過一點 Bootstrap 和 jQuery，這個博客主題的樣式部分的組織方式就是參考了 Bootstrap 的組織方式，另外也稍微閱讀過 jQuery中 $.ajax 以及事件相關的源碼。

在閱讀代碼的過程當中的收穫就是學習了一些組織代碼的方式，還有如何寫纔能有利於拓展，更加健壯。其中也學到了一些提升性能的技巧，函數緩存，事件隊列之類的。

博客主題的開發經歷

其實一開始寫主題只是想給本身用，以後發現蠻多人也喜歡我這個主題的，並時不時有人中 Github 上提 Issue，這對我是莫大的鼓勵。雖然我水平並非很高，可是寫出來的東西有人用感受真的是特別開心，也特別有動力去改進。

從開始去寫主題到如今差很少也一年了，這一年中我從前端小白變成前端大白。在維護的過程當中學習到不少東西，雖然目前寫得也不是很好，可是我仍是會慢慢改進繼續維護下去的。

維護的過程當中的收穫就是，當站在本身的角度看問題與在別人的角度看徹底是不同的，或許有個功能我並不須要，可是有人提了，我就得站在『用戶』的角度去思考，去實現。『用戶』只關心能不能用，好很差用，而並不關心代碼寫得怎麼樣。

實習期間遇到得難題

可能我作的工做相對簡單，就算不會，基本上靠搜索引擎都可以解決。我以爲能用 Google 解決的問題不算難題。以我如今的水平，還達不到遇到的難題 Google 搜索不到的😹

三面

三面基本上沒有問太過具體的前端相關的問題，大部分是在聊聊見解，聊聊項目。

開始讓我用紙畫出博客的設計，其實主要仍是主題，沒什麼難度，畢竟代碼都是我本身寫的。

而後讓我介紹一下我熟悉的一個框架，說的 React，說起到了 Vitrual DOM 和 diff 算法，說了一下 diff 算法的大概策略。還有說到組件化，單向數據流等等。幸運的是，我在二面以前刷了『深刻 React 技術棧』這本書，結合以前的實踐可以說個大概。

中間有聊到興趣愛好，我想了想好像只有寫代碼。聽歌應該也算？寫代碼的時候一定要聽歌。我記得去年國慶有一天從起牀寫到晚上睡覺，差很少寫了 11 個小時，那時候正在折騰 React 與 Meteor。我本身都以爲難以想象。

總結

多是運氣問題，我以爲個人這幾面難度都不高😹。得益於看的書，好多知識點都是書上有的。基本上基礎的前端面試題均可以在紅寶書上找到，真不愧爲前端面試寶典。另外 Github 上的這個博客主題也幫了很大的忙，300+ star 果真仍是有點用處的（雖說 star 不能表明什麼，並且的確寫得也很水，但做用不能否認）。

最後，基礎很重要，基礎紮實是基本。可是若是想要有突出的表現仍是須要更有深度的研究。須要常常思考總結，不只僅是浮於表面，更要深刻原理。