阿里面試題

電話初探

1. 說一下你瞭解CSS盒模型。 
   我就說了一下IE的怪異盒模型和標註瀏覽器的盒模型，而後能夠經過box-sizing屬性控制兩種盒模型的變換。
2. 說一下box-sizing的應用場景。 
   這個也不難，簡單說了一兩個應用場景，具體就不一一細說了。
3. 說一下你瞭解的彈性FLEX佈局. 
   這個我也比較瞭解，各類概念和屬性能想到的說了一大堆，也扯到了Grid佈局，基本這個也沒啥問題。
4. 說一下一個未知寬高元素怎麼上下左右垂直居中。 
   說了一下flex彈性佈局的實現，說了一下兼容性，扯到了postcss的一些東西，而後說了一下常規的兼容性比較好的實現。
5. 說一下原型鏈，對象，構造函數之間的一些聯繫。 
   這個我以前寫過相關的文章，本身也有比較深刻的理解，因此這個也不在話下，噼裏啪啦說了一大堆，也不知道面試官聽得咋樣。
6. DOM事件的綁定的幾種方式 
   說了三種，而後說了一些冒泡，默認事件，以及DOM2，DOM3級的一些標準。
7. 說一下你項目中用到的技術棧，以及以爲得意和出色的點，以及讓你頭疼的點，怎麼解決的。 
   這個因人而異，開放性問題，主要考察平時項目的一些積累吧，這個我回答感受也比較ok。
8. 有沒有了解http2.0,websocket,https，說一下你的理解以及你所瞭解的特性。 
   這個我看過一些文章，可是沒有什麼印象，扯了一些概念，可是回答的不是很深。

第一輪電話初探，大約面了50分鐘，就記起來這麼多，還有一些細節問題可能淡忘了，整體來講，面的都是以基礎爲主，而後boss說把我簡歷推薦給內部，進行正式的社招流程。

一輪技術面

而後當天晚上一個女的面試官就給我打電話了，說八點半進行下一輪技術面試，沒想到效率這麼快，我都沒怎麼準備。此次就直接省略自我介紹了。

1. webpack的入口文件怎麼配置，多個入口怎麼分割啥的，我也沒太聽清楚。 
   這個本身就說了一下本身的理解，以及本身用node寫的多入口怎麼配置，而後面試官說不是多入口配置，而後我又說了一下本身的理解，而後這題就過了。
2. 我看到你的項目用到了Babel的一個插件：transform-runtime以及stage-2，你說一下他們的做用。 
   這個我也還算比較瞭解，就說了一下ES的一些API，好比generator啥的默認不轉換，只轉換語法，須要這個來轉換，而後說profill啥的，扯了一下stage-1，stage-2，stage-3，這個問題回答還算清楚。
3. 我看到你的webpack配置用到webpack.optimize.UglifyJsPlugin這個插件，有沒有以爲壓縮速度很慢，有什麼辦法提高速度。 
   這個我主要回答了一下，我以前也沒怎麼了解，一個想到是緩存原理，壓縮只從新壓縮改變的，還有就是減小冗餘的代碼，壓縮只用於生產階段，而後面試官問還有呢？我就說，還能夠從硬件上提高，能夠獲得質的飛躍，好比換臺I9處理器的電腦。。。。
4. 簡歷上看見你瞭解http協議。說一下200和304的理解和區別 
   這個噼裏啪啦說了一堆，協商緩存和強制緩存的區別，流程，還有一些細節，提到了expires,Cache-Control,If-none-match,Etag,last-Modified的匹配和特徵，這一塊以前有過比較詳細的瞭解，因此仍是應答如流。
5. DOM事件中target和currentTarget的區別 
   這個沒答上來。。。
6. 說一下你平時怎麼解決跨域的。以及後續JSONP的原理和實現以及cors怎麼設置。 
   我就說了一下Jason和cors,而後問我JSONP的原理以及cors怎麼設置，這一塊本身也實踐過，因此仍是對答如流的。
7. 說一下深拷貝的實現原理。 
   這個也還好，就是考慮的細節不是很周全，先是說了一種JSON.stringify和JSON.parse的實現，以及這種實現的缺點，主要就是非標準JSOn格式沒法拷貝以及兼容性問題，而後問了我有麼有用過IE8的一個什麼JSON框架，我也不記得是什麼了，由於我壓根沒聽過，而後說了一下尾遞歸實現深拷貝的原理，還問了我typeof null是啥，這個固然是Object。。。
8. 說一下項目中以爲能夠改進的地方以及作的很優秀的地方？ 
   這個也是因人而異，開放性問題，大體扯了一下本身的經歷，也還OK。

最後問了有什麼須要問的地方，面試到這裏基本就結束了，大約面了一個多鐘頭，仍是蠻累的。整體來講，回答的廣度和深度以及細節都還算OK，以爲這輪面試基本沒什麼懸念。

二輪技術面

過了幾天，接到阿里另外一個面試官的電話，上一輪面試經過了，此次是二輪技術面，說估計一個鐘頭。此次依然跳過自我介紹之類的，直奔主題。

1. 有沒有本身寫過webpack的loader,他的原理以及啥的，記得也不太清楚。 
   這個我就說了一下，而後loader配置啥的，也還ok。
2. 有沒有去研究webpack的一些原理和機制，怎麼實現的。 
   這個我簡單說了一下我本身瞭解的，由於這一塊我也沒深刻去研究，因此說的應該比較淺。
3. babel把ES6轉成ES5或者ES3之類的原理是什麼，有沒有去研究。 
   這一塊我說了一下本身的思路，大體也還OK，我也沒去深刻研究怎麼轉換的，以前好像看過相似的文章，本身也只觀察過轉換以後的代碼是啥樣的，至於怎麼轉換的規則，真的沒去深刻觀察。
4. git大型項目的團隊合做，以及持續集成啥的。 
   這裏我就說了一下本身瞭解的git flow方面的東西，由於沒有實戰經驗，因此我就選擇性說明了這一塊的不熟練，而後面試官也沒細問。
5. 什麼是函數柯里化？以及說一下JS的API有哪些應用到了函數柯里化的實現？ 
   這個我就說了一下函數柯里化一些瞭解，以及在函數式編程的應用，最後說了一下JS中bind函數和數組的reduce方法用到了函數柯里化。
6. ES6的箭頭函數this問題，以及拓展運算符。 
   這一塊主要是API和概念的問題，扯了一些規範以及嚴格模式下其餘狀況this只想問題。
7. JS模塊化Commonjs,UMD,CMD規範的瞭解，以及ES6的模塊化跟其餘幾種的區別，以及出現的意義。 
   這個也是說了一下本身的理解和認知，本身對模塊化歷史以及一些規範都有所涉獵，這一塊也還湊合。
8. 說一下Vue實現雙向數據綁定的原理，以及vue.js和react.js異同點，若是讓你選框架，你怎麼怎麼權衡這兩個框架，分析一下。 
   主要是發佈訂閱的設計模式，還有就是ES5的Object.defineProperty的getter和setter機制，而後順便扯了一下Angular的髒檢測，以及alvon.js最早用到這種方式。而後扯了一下vue.js和react.js異同點，權衡框架選擇，調研分析之類，噼裏啪啦說了一大堆。
9. 我看你也寫博客，說一下草稿的交互細節以及實現原理。 
   這一款就按照本身用過簡書或者掘金，SG這類草稿的體驗，詳細說了一下，這個開放性問題，說到點基本就OK。咱們天天晚上八點在騰訊課堂都有前端的免費課程， 你要來聽課學習一下嗎？有沒有興趣呢？

最後面試官問我有什麼想問的嗎，面試到這裏基本就結束了，差很少面了一個小時，說過幾天就會給答覆，若是過了就會去阿里園區進行下一輪的技術面。（web前端學習交流羣：328058344 禁止閒聊，非喜勿進！）

三輪技術面

上一輪發揮感受沒前兩輪發揮好，因此仍是有點不自信的，沒想到第三天後，就來電話了，通知我去阿里園區面試。 
由於阿里西溪園區距離我不到十千米，我就踩着共享單車一點鐘就出發了，天氣比較熱，飄在路上，百感交集，身邊一輛法拉利轟鳴而過，又一輛蘭博基尼呼嘯而過，我內心一萬頭草泥馬奔騰，MLGB，內心暗想，爲神馬開這車的人不是此刻看文章的你？ 
走到半路了，面試官給我打電話了，說我怎麼還沒到，說約定的是兩點鐘，我一會兒就懵逼了，短信只有一個遊客訪問ID，並無通知我具體時間，反正無論誰的疏忽，我確定是要遲到了，因而我馬不停蹄，踩着賊難騎的共享單車，揹着微風，一路狂奔，到阿里園區已經是汗流浹背，油光滿面，氣喘乎乎。。。 
面試遲到了，印象確定很差，加上滿頭大汗的形象也不太好，加上本身飢渴難耐，這面是估計要GG了，一進來就直奔主題，此次是兩個大Boss面試我。

第一個面試官

1. 先自我介紹一下，說一下項目的技術棧，以及項目中遇到的一些問題啥的。 
   這個問題就是個開場白，簡要說明一下，問題都不大，這個面試官就是第一次打電話給我面試的那個boss，因此技術那塊boss內心也有個底細，因此沒再問技術問題。
2. 一個業務場景，面對產品不斷迭代，以及需求的變更該怎麼應對，具體技術方案實現。 
   具體業務場景，我就不一一描述，Boss在白板上畫了一個大體的模塊圖，而後作了一些需求描述。而後需求一層一層的改變，而後往下挖，主要是考察應對產品能力，以及對代碼的可維護性和可拓展性這些考察，開放性問題，我以爲還考察一些溝通交流方面的能力，由於有些地方面試官故意說得很含糊，反正就是一個綜合能力，以及對產品的理解，中間談到怎麼實現，也問到了一些具體的點，記得問到的有一下幾個。

① 怎麼獲取一個元素到視圖頂部的距離。 
② getBoundingClientRect獲取的top和offsetTop獲取的top區別 
③事件委託

第二個面試官

1. 業務場景：好比說百度的一個服務不想讓阿里使用，若是識別到是阿里的請求，而後跳轉到404或者拒絕服務之類的？ 
   主要是考察http協議頭Referer，而後怎麼判斷是阿里的ip或者啥的，我也不太清楚。
2. 二分查找的時間複雜度怎麼求，是多少 
   。。。排序的還算清楚一點，查找真的不知所措，沒回答上來，也沒猜，意義不大，不會就是不會。
3. XSS是什麼，攻擊原理，怎麼預防。 
   這個很簡單，跨站腳本攻擊XSS(cross site scripting)，攻擊類型主要有兩種：反射型和存儲型，簡單說了一下如何防護：

①轉義 
②DOM解析白名單 
③第三方庫 
④CSP 
本身對web安全這塊系統學習過，前先後後大約瞭解了不少，對於XSS,CSRF,點擊劫持，Cookie安全，HTTP竊聽篡改，密碼安全，SQL注入，社會工程學都有必定了解，因此這個天然也不在話下。

1. 線性順序存儲結構和鏈式存儲結構有什麼區別？以及優缺點。 
   我是類比JS數組和對象來回答的，反正還算湊合吧，本身都數據結構這塊多少仍是有些印象，因此入了前端，對數據結構和算法確實一直淡忘了。
2. 分析一下移動端日曆，PC端日曆以及桌面日曆的一些不一樣和須要注意的地方。 
   這個我能想到的大體都說了一遍，不一樣的場景交互和細節以及功能都有所誤差，以及功能的側重均可能不一樣。

3. 白板寫代碼，用最簡潔的代碼實現數組去重。 
   我寫了兩種實現方式：ES6實現： 
   
[...new Set([1,2,3,1,'a',1,'a'])] 

   ES5實現： 
   [1,2,3,1,'a',1,'a'].filter(function(ele,index,array){ return index===array.indexOf(ele)})

4. 怎麼實現草稿，多終端同步，以及衝突問題？ 這個回答的不算好，原本也想到類比git的處理方式，可是說的時候往另一個方面說了，致使與面試官想要的結果不同。