媒介
大三下學期由於眼睛得了過敏性結膜炎，只好在家養病，錯過了珍貴的演習時刻。大四到校就最先了慌張的秋招。拿到的第一個offer是一家廈門的公司，當時跟手藝小哥談的很興奮，厥後由於廈門比較遠，而且公司的營業我不太感興緻，所以沒有去。以後又面了許多家公司，一向延續到來年四月，由於手藝太菜，投的大公司都進了人才庫（笑，末了進了一家還不錯的小公司，公司前後端星散，用react手藝棧。在此記載一下大四以來的前端口試。
口試預備
- 預備簡歷。參照了不少優異的簡歷后（主假如知乎，和用搜刮引擎搜刮到的），寫好了本身的簡歷。
- 刷面經。主假如牛客網，牛客網秋招和春招都有面經分享活動，許多拿到大廠offer的大牛會在上面分享口試履歷。
手藝面
1. 毛遂自薦
先是個人的基本信息，xx大學xx專業大四門生，以後說了本身善於的方面，用xx手藝寫過某某項目，在xx公司演習，演習時期寫過xx，末了講了本身的興緻和職業規劃。
口試官平常會依據毛遂自薦問問題，毛遂自薦時說了本身用vue寫過某某項目，然後就被問了一堆vue相干的題…
2. 說一下vue的雙向數據綁定
基本道理是宣布定閱情勢和Object.defineProperty()挾制各個屬性的setter、getter，在數據更改時宣布音訊給定閱者，觸發響應的監聽回調。由於有看過這方面的博客，對比博客寫過一個簡易版的vue，所以簡樸說了下細緻完成歷程
3. 說下你對vue生命周期的明白
vue的生命周期就是一個vue實例從建立到被燒毀的歷程。說了一遍vue官方文檔那張生命周期的圖。
4. 怎樣寫一個vue組件
主假如三個部份，模板、款式和劇本。講了各個部份須要斟酌什麼，子父組件的通訊、依據細緻的功用運用響應指令，趁便舉了個例子、款式style標籤能夠運用css一些預處置懲罰器的語法，經由過程lang屬性定義等。註冊組件能夠全局註冊也能夠部分註冊。寫單文件組件的話，須要安vue-loader，在webpack設置；用jsx的話模板寫在render函數里，css文件直接import引入，jsx文件用babel-loader處置懲罰，還須要安幾個babel的插件來支撐，忘了那幾個插件細緻叫什麼…
5. 用過scss？在vue組件中怎樣用
style標籤中lang="scss"，安node-sass和sass-loader，webpack中做響應的設置。node-sass裝置比較坑，由於牆的緣由，用國內收集直接npm install安不上，平常是給敕令行設代辦，或許直接用淘寶的cnpm來安。以後在vue單文件組件的style標籤，lang設為scss，把處置懲罰scss文件的loader加到設置里。
6. scss怎樣寫一個函數
@mixin或@function，寫法和js的一般函數一樣，@mixin加函數名，假如有參數，能夠寫參數，參數能夠定義默認值，也能夠運用rest參數，以後大括號，內部是函數語句，和一般css寫法一樣，只是能夠運用scss內部掌握敕令，內置函數，變量等等，用@include來挪用。@function定義的函數和一般js函數一樣，能夠用@return返回值，和一般js函數挪用要領一樣，挪用后返回的就是@function內部用@return返回的值。
7. webapck打包出來的文件看過嗎?
沒看過…
8. 你怎樣明白模塊化？
前端不斷髮展，須要在前端處置懲罰的邏輯也愈來愈多，js文件愈來愈巨大，這時刻為了更好的保護和復用js代碼，須要組織js文件，依據特定功用將js文件舉行分別，這就是模塊化。模塊化須要恪守一致的範例，服務端node.js用的是CommonJS，客戶端有基於require.js的AMD範例，基於sea.js的CMD範例，也能夠用gulp、webpack等的打包東西來完成模塊化，es6有原生的模塊化支撐，但現在的瀏覽器還不支撐。
9. 用過require.js，道理知道嗎？
沒有細緻相識過…記得是動態建立script標籤去要求劇本，經由過程監聽script的onload事宜，來肯定加載遞次…
10. 講一下js的原型
每個js對象都有[[prototype]]內部屬性，這個屬性對應的就是該對象的原型，在一些瀏覽器原型對象能夠經由過程__proto__接見，es6能夠經由過程Object.getPrototypeOf()來接見，原型鏈的盡頭是null，之前是Object.prototype
11. 引見一下閉包？
js中閉包是指能夠接見另一個函數作用域變量的函數，平常是定義在外層函數中的內層函數。道理和js的變量剖析機制有關，js剖析變量會沿着作用域鏈層層向上查找。每次挪用一個函數時會建立響應的實行上下文，和作用鏈，作用鏈會賦值給內部屬性[[scope]]，如許內層函數就能夠拿到外層函數作用域的變量，縱然外層函數的實行上下文已被燒毀，比方挪用外層函數，返回內層函數，也能夠經由過程內層函數拿到外層函數作用域的變量。
12. js繼續怎樣完成？優缺點？
高程上引見的很細緻，組織函數式，類式，組合式，寄生組合式，es6能夠直接extends
13. arguments和數組有什麼區分？怎樣把arguments變成數組？
argument是對象，是Object的實例，不能挪用數組的要領。轉數組能夠[].slice.call(arguments)，es6直接Array.from(arguments)或經由過程數組擴大運算符[...arguments]
14. call，apply，bind區分？
都定義在Function.prototype上，第一個參數是挪用的函數內部this指向的對象，第二個及以後是要傳入的函數參數，call和bind以值的情勢傳入，apply以數組的情勢傳入，call和apply返回挪用函數的返回值，bind返回一個綁定函數。經由過程挪用符()挪用時，綁定函數內部this值指向挪用bind的第一個參數，前幾個參數綁定了挪用bind時傳入的第二個及以後的參數；經由過程new挪用時，會疏忽bind綁定的this值，將原函數當作組織器，參數有用。
15. 完成一個bind要領
MDN文檔上有bind的Polyfill，注重斟酌new綁定函數的狀況
16. new一個對象的歷程
建立一個空對象，this指向這個空對象，繼續組織函數的原型，實行組織函數中的代碼，返回this
17. es6有哪些新特徵
let，const，原生的模塊化支撐，構造賦值、異步的處理要領promise、generator、async函數等，一些語法糖，比方箭頭函數，class，對象要領屬性的簡寫等
18. 講一下let和const
let用來定義變量，const定義常量，塊級作用域、暫時性死區、雷同作用域不能反覆定義、全局定義不會掛在window上，另外let作輪迴變量，每次輪迴都是一個新的變量，const必需在聲明時賦值，以後給const定義的變量從新賦值會報錯。
19. promise怎樣明白？
讓異步操縱邏輯越發清楚，處理了異步操的作回調嵌套問題。promise對象有三種狀況，pending、fulfilled和rejected，promise對象內部保留一個須要實行一段時刻的異步操縱，當異步操縱實行完畢后能夠挪用resolve或reject要領，來轉變promise對象的狀況，狀況一旦轉變就不能再變。new 一個promise后能夠經由過程then要領，指定resolved和rejected時的回調函數。
20. 箭頭函數和一般函數區分
不能用作generator函數，內部this是定義時地點環境的this，不能經由過程new挪用，內部沒有arguments對象
21. 講講ajax
與服務器通訊的一種手腕，重要用於異步通訊，無需革新頁面就能夠拿到服務端的數據，或向服務端發送數據，經由過程xhr對象完成。
22. 怎樣跨域？
ajax跨域，jsonp、CORS，差別域頁面的通訊，document.domain和HTML5的postMessage
23. jsonp道理？
道理是script元素的src屬性不受同源戰略限定。和服務端約好函數名，要求文件的時刻，服務端返回一段 JavaScript。這段 JavaScript是挪用函數的語句， 挪用了約好的函數，而且將數據當作參數傳入。函數在前端定義，處置懲罰完數據以後，remove掉script元素。
24. 相識哪些排序算法
沒有學過算法，本身也沒有看過相干的學問…大一時刻學過冒泡和挑選排序，還知道有堆排序、快排和合併排序
25. 數組去重手寫
es5完成
function unique(arr){
var newArr = [];
for(var i in arr) {
if(newArr.indexOf(arr[i]) == -1) {
newArr.push(arr[i])
}
}
return newArr;
}es6
function unique(arr) {
return [...new Set(arr)]
}26. 手寫二分查找
當時沒寫出來…之前基礎沒看過，厥後網上查了下，道理很簡樸。有序數組，先比較中心元素，假如即是中心元素，則返回中心元素的索引，假如比中心元素大或小，則從右側區間或左側區間查找，和最先一樣再比較中心元素，以此類推。
27. rem和em區分
rem是基於根元素font-size舉行盤算，em輕微龐雜，元素font-size屬性是相關於父元素font-size盤算，其他屬性相關於本元素font-size盤算。
28. 說一下position定位
position屬性有五個值，默認值是static。相對定位relative是關於元素一般位置舉行定位，偏移后底本的位置仍佔有空間，不會影響其他元素的位置，未離開文檔流。相對定位會離開文檔流，相關於已定位的先人元素舉行定位。牢固定位和相對定位類似，然則是相關於視口的。另有一個新增值sticky，是牢固定位和相對定位的夾雜，必需指定top、right、bottom、left、四個闕值之一，可口滾動到闕值前是相對定位，以後是牢固定位，兼容性不好
29. 怎樣完成垂直居中
單行文本直接設height即是line-height、相對定位top: 50%;再向上移本身寬度的一半，假如不定寬用transfrom: translateX(-50%)，flex規劃、tabe-cell、另有一個比較hack的要領，子元素display: inline-block; vertical-align: middle;父元素的after偽元素，height: 100%，display: inline-block; vertical-align: middle; font-size: 0;
30. 怎樣消滅浮動
主假如兩種，一種是觸發BFC，由於BFC內部元素和外部元素不會相互影響；一種是用clear屬性，經常使用
.clearfix::after {
content: "";
display: table;
clear: both;
}31. 談一下BFC?
全稱塊級格式化上下文，是一個自力的規劃環境，它劃定內部的塊級盒子怎樣規劃。BFC中的元素的規劃是不受外界的影響，在一個BFC中，塊盒與行盒都邑垂直的沿着其父元素的邊框分列。重要用於消滅浮動和防止margin摺疊。浮動元素，position非默認值或相對定位元素，display為table-cell或table-caption元素、overflow不為默認值元素都邑觸發BFC。
32. 日常平凡用什麼IDE
VScode，webStorm和sublime也用過，不介意嘗試新的編輯器
非手藝面
有一家公司是群面，給了一個問題讓我們議論，一共十個人，十個職業，只能活八個，讓哪八個人活？
這家公司的一面，一面是hr面，只需議論的時刻活潑一些，沒有標準答案，言之有理即可
你是怎樣進修前端的？
書本、視頻、博客、本身演習。假如想進修某方面的學問，會去看知乎上引薦的書，也會看豆瓣上的批評，剛最先學js的時刻看過高程、言語精鍊、你不知道的js上冊等等。視頻主假如慕課網，隨着慕課網上的視頻敲過許多demo。珍藏了一些人的博客，比方阮一峰教師、張鑫旭教師，有相干的學問點不懂，直接在他們的博客上面查。本身演習的資本許多，慕課網上的一些小的項目，百度前端手藝學院上的問題，github上的項目，都能夠本身完美，擴大。
希冀薪資
當時要的低了…所以希冀薪資照樣要高一點。高了的話，hr會說，我們公司能給的最高薪資是多少，問你能不能接收。
日常平凡興緻愛好
看書、看動漫、看電影、跑步
看過哪些書？近來在看什麼動漫？
看書並沒有喜好看特定作者或特定範例的書，都是看一本書，對某些方面感興緻又去看那些方面的書。比方看完《1984》后，由於《1984》有觸及一些哲學的內容，又去看了《蘇菲的天下》《西方哲學簡史》。對日本感興緻，看了《菊與刀》(當時正值二戰，作者立場很明顯)；對美國感興緻，看了林達的《汗青的憂愁》。也有追一些熱門，國內劉慈欣教師的《三體》和一本短中篇小說合集，二熊的兩本書《最好的我們》和《你好，舊時間》都看過，總之看的很亂很雜。
動漫剛看完EVA…一向有追one piece的漫畫，國內二叔的一人之下
有列設計的習氣嗎？
有。記在那裡？手機上。輕易給我看一下嗎？看了以後hr說，你這並非設計，沒有停止日期…
日常平凡壓力大的時刻怎樣處置懲罰？
晚上的話會出去跑步，有時刻壓力太大學不進去，會睡覺或許看看動漫，假如不可就活動，活動對我很有用
將來的職業規劃？
現在只是想精進前端手藝，久遠的還沒想過
家離北京近，為何來杭州？
北京壓力太大，而且在北部地區呆久了，想來南邊看看。
想不想去阿里之類的大公司？
沒有想過（是真的沒有想過…由於手藝太渣，想去也進不去）然後被hr批評了…假如想做手藝的話，照樣要有去大公司事情的主意。
怎樣對待加班？
為了趕項目進度能夠接收（進去公司后問同事，同事說我們公司加班不多…）
你有什麼想問我的？
前端部門手藝棧，重要有哪些營業、演習期多久
