JS一次前端面試經歷記錄
本文實例講述了JS一次前端面試經歷。分享給大家供大家參考，具體如下：
最近公司在做一些戰略調整，部門有不少老員工前輩們都陸陸續續的離職或者被離職了。而我所在的團隊——網易菠蘿，也被歸并到游戲運營中心了。因為產品策劃還沒有出來、暫時沒什么需求做，閑得有點e-g-g疼的，每天從早到晚都是待在公司看看書、刷刷知乎等。我真是命途多舛啊，還沒有真正步入社會，就見證了一個上百人的事業部說沒落就沒落。甚至已看破紅塵，連參加省公務員考試的計劃都做好了。這可不是開玩笑的哈，已經在報名費和復習資料上花了兩三百塊啦，只是因為思想覺悟比較低，始終還是對政治沒有興趣，那幾本復習資料到現在還沒翻過一頁。幾天前，一哥們兒說他們公司（CVTE）有個春季校園招聘，叫我可以去試試。這里先補腦一下CVTE是個怎么樣的公司哈，它在廣東這邊也算是小有名氣的，主要原因是它的薪酬比BAT還要高出不少，傳說畢業生月薪已經15K左右，而且一年還有16-17薪。加上它的校招宣傳非常給力，廣東高校計算機專業的同學應該對它都有耳聞過，其他省份的同學可能就比較陌生，不過外界對這個公司的評價并不怎么好，有興趣的可以自行到知乎看。因為CVTE的薪酬確實很吸引人，所以我也有點兒心動哈。不過當時已經過了筆試時間，而且還不能霸面。幸好我那哥們兒和HR姐姐還算熟，而且我的簡歷寫著有NAT實習經歷，也就順利的獲得了面試機會。
昨天（2月8號），我還是按照平時的時間8：00起床（因為公司9：30上班）。一打開手機，就看到了推薦我去CVTE的哥們兒在微信發了好多條信息，他說已經和HR說好了，讓我8：30之前趕到黃村地鐵站坐CVTE面試班車過去面試。我的天吶，我本來只是開玩笑啊，想不到這哥們兒是認真的。畢竟他也是好不容易才幫我爭取到了面試機會，放他飛機可不太好啊啊。所以，七手八腳的穿上衣服、鞋子，沒來得及刷牙洗臉就騎上ofo直奔地鐵站去了。這幾天的廣州下著冷冷的春雨，早/上的氣溫也就10度左右。我當時只穿件襯衣，真是冷得發抖啊。還好，8：25就到了黃村地鐵站，然后從C出口一出去就看到了白色的CVTE班車。當時車上已經有10來個人。但是，后來因為要等一個睡過頭的家伙，到了8：50老司機才開車。CVTE給我的感覺是挺人性化的，竟然愿意為了一個遲到的考生等待了20分鐘。大概坐了40分鐘的車程，就到了廣州羅崗CVTE園區了。一下車，眼前就是金碧輝煌的傳說 中的CVTE大廈。不知道是因為這里的緯度比學校高、還是因為這里山比較多，反正氣溫真的比學校要低了好多，我全身都在顫抖。下車大概等待2分鐘，HR姐姐就下來帶我們到樓上去面試了。等候區和面試區是同一個會議室。當時有2位HR姐姐、6位面試官（4個一面的、2個是二面的）。剛剛坐下來，HR姐姐就說先上4個同學到前面來面試。我當時第一個上去的。尷尬的事情這時候發生的，面試官哥哥問了我手機尾號4位數字，然后他輸入了幾遍都找不到我資料。于是叫來了HR姐姐問是怎么回事，這時候HR姐姐才恍然想起來我是沒有筆試、直接來面試的，趕緊把我拉到一個角落，叫了另外一個同學上去面試。她問我帶簡歷了沒有，我說沒有。然后面對面加了微信，并把很久以前做的一份電子簡歷發給了她。然后就叫我回到座位去等待。
一面大約過了30分鐘，HR姐姐叫我上去第一輪面試。這時候因為太冷，我全身都在發抖啊。面試官好像看到我在發抖，然后就說不用緊張哈、放松點兒。大哥啊，我這是冷啊不是緊張 啊、沒有看到我才穿一件襯衫嗎。然后，他先讓我做了簡短的自我介紹。然后就開始進入正題了，下面是當時被問到的一些問題：
JS有哪些手段可以實現繼承？ 說說JS的閉包？ 用純JS實現，點擊一個列表時，輸出對應的索引（不能用JQuery哦） CSS實現矩形按鈕右邊緣的中間有個往里凹的小半圓，如圖：
為什么用vue而不用NG或者React？ 第1題，這可簡單啦，JS主要有借用構造函繼承和原型繼承以及兩者的組合。不懂的可以看看《JS高教》 第2題，不懂的自行補腦去 第3題，可能面試官的意圖也是想考察我們能否熟練掌握閉包吧。如果有刷過面試題的同學可能一下子就會做出來，但是，如果經驗不足的同學可能會寫出如下的代碼：<body> <ul> <li>test1</li> <li>test2</li> <li>test3</li> <li>test4</li> <li>test5</li> <li>test6</li> <li>test7</li> <li>test8</li> <li>test9</li> <li>test10</li> </ul> <script> var lis = document.querySelectorAll(’ul li’); for(var i = 0, len = lis.length; i < len; i++) { lis[i].addEventListener(’click’, function () {console.log(i); }, false); } </script></body>
你運行一下代碼會發現，無論你點擊哪個列表，控制臺都是輸出10。這是因為var聲明的變量是函數作用域的，而不是塊級作用域的。也就是說，for循環10次，每次都是改變同一個i，所以它的值會從0一直加到10。還有個問題是閉包導致的，閉包保存的是外部變量的引用，而不是值。也就是說，循環10次監聽器創建了10 個閉包，它們里面的i引用的是同一個啊。所以全部都指向了10.要解決這個問題有兩種方法。一種是使用ES6的let來替代 var i = 0 里面的var， 因為let支持塊級作用域。改成如下就正常了。
for(let i = 0, len = lis.length; i < len; i++) { lis[i].addEventListener(’click’, function () {console.log(i); }, false); }
還有一種方法，就是很多經典書本都提到的，使用立即執行函數來切斷閉包對外部變量i的引用：
for(var i = 0, len = lis.length; i < len; i++) { (function (i) {lis[i].addEventListener(’click’, function () { console.log(i);}, false); })(i) }
當然啦，如果對閉包不是很熟練，還可以通過事件委托來避開這個陷阱哈，代碼如下：
var ul = document.querySelector(’ul’); var lis = document.querySelectorAll(’ul li’); ul.addEventListener(’click’, function (e) { var target = e.target; if(target.nodeName.toLowerCase() === ’li’) {console.log([].indexOf.call(lis, target)); } }, false);
使用了事件委托，減少了監聽器的綁定（只對列表的父親元素監聽），這種方法說不定還會加分呢。哈哈，我當時就是用這種方法來實現的，面試官可能覺得我的解法有點不尋常、頓時一臉蒙B，甚至還一度懷疑 console.log([].indexOf.call(lis, target)) 這段代碼是不是有問題。直到后來我直接在他的筆記本跑了一遍，他才相信是正確的。
第4題，因為面試官說要通過偽元素來實現，我的CSS本身就不咋滴，只知道好像用到了CSS3的border-radius，但是要使用偽未元素我還真心不會哇。所以當時就直接說不會做，現在也不會。請CSS大神在評論區發一下代碼哈~
第5題，主要談框架相關的。因為目前的情況是，React才是主流，很多團隊都在用React，CVTE也不例外。他似乎很關心我為什么要使用vue。我當時給出的理由是：NG1臟值檢測性能太低并且相對過時，NG2目前又不夠成熟，React的JSX語法個人不太喜歡，而vue比較輕量級、并且支持jade模板（ 我們舊項目是使用jade模板寫的，遷移會相對容易）。然而，接下來便遭到了面試官的連續挑釁，說我用vue不會是因為它的中文文檔比較齊全吧（鄙視我英文差？？？）。還說vue是不適合做大型項目。最后一句更狠：你們使用vue真是最愚蠢的選擇。（我當時心里真的有一萬只草泥馬在奔騰） 其實，我個人覺得，框架并沒有好壞之分的，每個框架必然有它存在的理由。React也好，NG也行，Vue也罷，蘿卜、荷蘭豆各有所愛嘛。反正，面試官說的那些話我真的聽得挺反感的。 話又說回來。問完了第5個問題之后 ，面試官說面試就此結束，讓我回到座位休息。 CVTE對于考生的招待真的挺周到的，桌面上有水果、零食、飲料等等。因為當時手機快沒有電了，所以，就坐在那里邊吃水果邊看其他人面試。
二面然后，等待了一個多小時，輪到了二面。面試官大概三十多歲，可能是前端組長或者技術總監之類的職位吧。他主要是問到了下面的這些問題：
說說JS的內存機制及垃圾回收機制 下面的代碼有內存泄漏嗎var user = {name: ’tom’, age: 20, gender: ’male’}var test = document.getElementByid(’test’)test.onclick = function() { test.innerHTML = user.name;}// ...后面還有很多其他操作，最后把user對象釋放掉user = null; // 釋放對象 實現一個算法，尋找字符串中出現次數最少的、并且首次出現位置最前的字符 如'cbaacfdeaebb'，符合要求的是'f'，因為他只出現了一次（次數最少）。并且比其他只出現一次的字符（如'd'）首次出現的位置最靠前。 http和tpc的關系，以及什么是https Node的特點（優點和缺點） 你在騰訊和網易實習期間學到的東西？ 未來三年的職業規劃
至于二面的問題都不是很難，下面簡單的來看一下：
第1題，基本類型（number, string, boolean, null, undefined, symbol）是在棧的，而其他的引用類型都是在堆的。垃圾回收是采用了計數引用法（如果兩個對象之間存在循環引用時，會有內存泄漏，因為計數無法變為0 ）這里寫錯了，誤導了大家，不好意思哈。JS使用的是標記清除法。原理可以看看《JS高教》第三版的78頁。
第2題，有內存泄漏，這是閉包本身的問題。完全消除閉包的內存泄漏是不現實的，但是，如果采用下面的方法可以減少內存泄漏：var user = {name: ’tom’, age: 20, gender: ’male’}var test = document.getElementByid(’test’)(function (name) { test.onclick = function() { test.innerHTML = name; }})(user.name);user = null;
第3題算法題，也不很難，大家可以自己試試去實現 ，如果做不出來的再到評論求助啦，這里就不貼出代碼了。
第4題，考察了計算機網絡的tcp三次握手以及http的請求頭等。https是使用安全套接字進行加密的，可以說HTTPS = SSL + HTTP。
第5題，Node的特點是異步非IO阻塞、適合高并發，但不適合密集型計算
第6、7題都是主觀題，可以隨便吹一下水便好。
因為當時已經是飯點時間，面試官也有點急著去吃飯，就沒有再問我問題了。
二面面完，已經是中午12點多了。我那哥們兒鵬哥已經在門口等著我一起去飯堂。CVTE的飯菜不錯，自助餐，但是，那個碗有點小，沒打多少就裝滿了。飯堂里，公司的人挺熱情的，因為背著書包大家都知道我是來面試的，就會問我一些問題，或曰“你來面試什么崗位啦”，或曰“你是本科生還是研究生啦”。。。反正就是挺熱情的嘛。打好飯菜剛剛坐下來，還沒有吃幾口飯，鵬哥說剛剛接到HR消息，班車馬上就要開走了，要我快點吃。我下午還要回來公司上班，在這鳥不拉屎的地方如果錯過了班車，后果有多嚴重可想而知的。于是我就干脆不吃了，直接把飯菜倒掉，直跑樓下坐班車。剛剛上車，司機就開車了，駛向香雪地鐵站。再見了，CVTE！
后記首先說一下這次面試的水平吧，其實，從去年9月到現在，我已經有大半年沒有參加過任何面試了，很多基礎和面經寶典也忘記得差不多了。另外，本來并沒有打算來面試的，只是和鵬哥開了個玩笑而已，結果弄假成真，他都已經幫我去找HR安排好了。所以也不好放人飛機嘛！如果不去這不是在搞人家嗎？這是第一次面試CVTE，以前聽人說CVTE對算法要求比較高、面試相對是比較難的。這次自己反而沒有怎么被問到算法題目。面試題目還算正常、難度還可以接受。關于對CVTE的評價，就不好下結論，因為畢竟就只是去面了一個上午試而已，不夠了解這是個什么樣的公司。不過，總的來說，從有班車接送、到面試時有水果飲料、再到面完試帶考生去飯堂吃飯，我覺得CVTE是個還不錯的公司呢！至于面試結果，現在還沒有出來哈。也許過了，也許掛了，誰又知道呢？
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容可查看本站專題：《JavaScript數學運算用法總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript數組操作技巧總結》、《JavaScript排序算法總結》、《JavaScript遍歷算法與技巧總結》、《JavaScript查找算法技巧總結》及《JavaScript錯誤與調試技巧總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章：
網公網安備