混子前端寒冬求職筆試題-01

寫在前面的話

混子前端大學畢業之後，隨波逐流入職了一家O2O公司，開始了前端之旅～

固然2016年前端的市場仍是很可觀的，那時候問起前端優化，只要答出雪碧圖這類回答就能夠了(ps: 也許當時菜的摳腳)～
在經歷了公司運營不景氣和互聯網寒冬，加上混子前端自認爲前端功底很紮實以後，在18年末決定主動請辭，碰巧遇上了公司裁人，沾沾自喜拿了公司n+1，走人，開始了前端面試合集～

混子前端雖然在O2O公司，但也由於公司奇葩需求用過vue/react框架，這裏省略jQuery，不知地厚天高的混子前端在不瞭解其原理以後就在簡歷寫上了 「熟悉」 兩大框架，被各司虐的各類***，這裏不吐槽本身！提到這裏相信你們會問你JS水平怎麼樣，當時JS連繼承都只知道apply/call/bind三種方法（PS：實際上是一種方法），並不知道組合繼承、寄生式繼承等等，就開始了面試之旅！

好了，廢話很少說，開始切入正文，但願個人面試題能夠給予你們一些幫助：

某民在線 筆試題：

一、請解釋一下爲何要清除浮動？清除浮動的方式

二、編程題：請用JavaScript編寫獲取URL中的參數值，URL以下所示：
http://x.peopleyun.cn/getToTalCount?flag=1&keyword=&industry=42

三、ES5和ES6的繼承有什麼區別？

四、在金融應用產品中，數值經常使用千分位分隔，請使用JavaScript實現一個具備此功能的簡單函數

五、爲何瀏覽器會有跨域問題，怎麼解決？

六、描述一下React或者Vue的生命週期？

七、webpack用來解決什麼問題？

八、開放性問題：爬蟲引擎是怎樣抓取頁面的？如何防止採集？

某舞團筆試題(D卷) 筆試題：

一、如下結果裏，返回true的是：

• A) 1 === '1'
• B) !![]
• C) !!''
• D) null === undefined

二、對如下HTTP狀態碼的描述，不正確的是？

• A）301和302狀態碼都表示請求的資源被轉移到新地址
  
• B）服務器返回304時，須要同時返回請求的資源內容
  
• C）2xx的狀態碼錶示請求成功
  
• D）若是服務器請求第三方API超時，應該返回504

三、已知有5頂帽子，3頂白帽子，2頂黑帽子，甲乙丙三個聰明人頭上各帶一頂帽子，他們不能看到本身的帽子，可是能夠看到另外兩我的的帽子。甲乙丙能夠輪流說話，但只能說「個人帽子顏色是黑(白)色」和「我不知道本身帽子的顏色。」如今甲先說了「我不知道本身帽子的顏色」，乙接着說「我不知道本身帽子的顏色」，如今輪到丙說，丙會說：

• A）我不知道本身帽子的顏色
  
• B）個人帽子顏色是白色
  
• C）個人帽子顏色是黑色
  

 四、如下代碼執行後，a.x和b.x的結果分別是？

function A(x){
    this.x = x
}
A.prototype.x = 1;

function B(x){
    this.x = x
}
B.prototype = new A();

var a = new A(2), b = new B(3);
delete b.x;複製代碼

五、說出如下代碼存在什麼問題

Array.prototype.contains = function(obj){
    return this.indexOf(obj) >= 0
}	複製代碼

六、小明要實現一個效果，在控制檯每隔1秒依次輸出0,1,2,3,4，如下代碼有問題，該如何修改？

for(var i = 0; i<5; i++){
    setTimeout(function(){
        console.log(i)
    }, 1000 * i)
}複製代碼

七、請指出一下結構中A標籤內的字體顏色值：

<div id="contact">
    <h1 class="safelink">
        <a href="http://zhuomian.360.cn/">360桌面</a>
    </h1>
</div>

<style>
    a{color: #ccc}
    #contact a {color: #336699}
    .safelink a {color:#f60}
    h1 a {color: #eee}
</style>
複製代碼

八、以下HTML代碼

<ul>
    <li>奇數行</li>
    <li>偶數行</li>
    <li>奇數行</li>
    <li>偶數行</li>
    <li>奇數行</li>
</ul>複製代碼

請經過CSS實現以下樣式： 

•  奇數行背景爲#ccc, 偶數行背景爲#eee。 
• 3的倍數行字體顏色爲#f00。
  

 九、補充CSS樣式實現以下圖的效果(圓的直徑爲100px)

<div id="ball"><div>

#ball{

}
複製代碼

十、實現一段JS，當鼠標在矩形區域內移動時，給出鼠標到矩形對角線的距離：

某貓星廚 筆試題：

一、10+'20' = ？再加'20'呢?

二、設計一個函數實現add(3)(4)

三、localStorage與sessionStorage的區別

四、設計一個函數實現兩個20位的數字相加

五、vue中，已經聲明瞭變量a=10, 經過函數調用去改變a的值，fn()的{{a}}會如何顯示？爲何？

fn(){
    for(let t = 0; t< 100; t++){
        this.a = t
    }
}複製代碼

六、給定一個排序數組喝一個目標值，在數組中找到目標值，並返回其索引，若是目標值不存在於數組中，返回它將會被按順序插入的位置。

輸入：[1,2,5,6], 2
輸出：1

輸入：[1,3,5,6], 5
輸出：2

輸入：[1,3,5,6], 7
輸出：4

輸入：[1,3,5,6], 0
輸出：0
複製代碼

      好了，因爲是上班時間，發現Jira上又有混子前端的bug了，已經隱約感覺到老大在身後盯着個人屏幕，瑟瑟發抖，so未完待續...

      ps：若是大神們有空能夠在底下留言解題思路 

      pps: 每一個題都必定不是一種答案，請思慮周全些