前段面試

時間 2019-12-10

原文原文鏈接

轉載自：http://www.javashuo.com/article/p-zlsqcpel-cq.html
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支持塊級做用域。改爲以下就正常了。javascript

for(let i = 0, len = lis.length; i < len; i++) { lis[i].addEventListener('click', function () { console.log(i); }, false); }

還有一種方法，就是不少經典書本都提到的，使用當即執行函數來切斷閉包對外部變量i的引用：html

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)) 這段代碼是否是有問題。直到後來我直接在他的筆記本跑了一遍，他才相信是正確的。vue

第4題，由於面試官說要經過僞元素來實現，個人CSS自己就不咋滴，只知道好像用到了CSS3的border-radius，可是要使用僞未元素我還真心不會哇。因此當時就直接說不會作，如今也不會。請CSS大神在評論區發一下代碼哈~java
第5題，主要談框架相關的。由於目前的狀況是，React纔是主流，不少團隊都在用React，CVTE也不例外。他彷佛很關心我爲何要使用vue。我當時給出的理由是：NG1髒值檢測性能過低而且相對過期，NG2目前又不夠成熟，React的JSX語法我的不太喜歡，而vue比較輕量級、而且支持jade模板（咱們舊項目是使用jade模板寫的，遷移會相對容易）。然而，接下來便遭到了面試官的連續挑釁，說我用vue不會是由於它的中文文檔比較齊全吧（鄙視我英文差？？？）。還說vue是不適合作大型項目。最後一句更狠：大家使用vue真是最愚蠢的選擇。（我當時內心真的有一萬隻草泥馬在奔騰）
其實，我我的以爲，框架並無好壞之分的，每一個框架必然有它存在的理由。React也好，NG也行，Vue也罷，蘿蔔、荷蘭豆各有所愛嘛。反正，面試官說的那些話我真的聽得挺反感的。
話又說回來。問完了第5個問題以後，面試官說面試就此結束，讓我回到座位休息。
CVTE對於考生的招待真的挺周到的，桌面上有水果、零食、飲料等等。由於當時手機快沒有電了，因此，就坐在那裏邊吃水果邊看其餘人面試。node

二面

而後，等待了一個多小時，輪到了二面。面試官大概三十多歲，多是前端組長或者技術總監之類的職位吧。
他主要是問到了下面的這些問題：面試

說說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阻塞、適合高併發，但不適合密集型計算
第六、7題都是主觀題，能夠隨便吹一下水便好。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。