博主畢業接近3年半了，年初公司進行了一次業務調整，hr小姐姐明裡暗裡讓我們自動滾蛋，但是我牛脾氣上來了你不說可能我自己會走，你這一說我偏不走了，於是乎，生生熬到9月份。。。

    9月中旬開始改簡歷，投遞簡歷。。。小姐姐我並不是大神，簡簡單單的一個小前端，主要做官網型別的開發，主要使用html,css3,javascript,jquery外加一點兒vue.js，後端語言稍微瞭解一點兒php，沒辦法，原來php小哥哥走了，沒人做了，我就硬著頭皮改著。個人感覺可以了，就挑了幾個合適的公司開始投簡歷，過了兩天開始接到面試電話，然後開始了長達一個多星期的面試。

  一開始什麼準備都沒有，直接去面試，基本都被虐的不行，但也是自己略菜，有些基本的js問題都忘了，回來好好複習了一下之後，後面的面試基本沒什麼問題，但是總能碰到一些我無法描述的問題。下面我把我面試過程中遇到的問題分享給大家：

1、html三欄佈局有幾種(就是左右固定，中間自適應)

     浮動佈局float、定位佈局、flex佈局、表格佈局、css3柵欄佈局

<style media="screen">    //浮動佈局float
      .layout.float .left{
        float:left;
        width:300px;
        background: red;
      }
      .layout.float .center{
        background: yellow;
      }
      .layout.float .right
 
{
        float:right;
        width:300px;
        background: blue;
      }
 </style>

<style>
        .layout.absolute .left-center-right>div{   //定位佈局
          position: absolute;
        }
        .layout.absolute .left{
          left:0;
          width: 300px;
          background: red
 
;
        }
        .layout.absolute .center{
          left: 300px;
          right: 300px;
          background: yellow;
        }
        .layout.absolute .right{
          right:0;
          width: 300px;
          background: blue;
        }
</style>

<style>
        .layout.flexbox{    //flex佈局
          margin-top: 110px;
        }
        .layout.flexbox .left-center-right{
          display: flex;
        }
        .layout.flexbox .left{
          width: 300px;
          background: red;
        }
        .layout.flexbox .center{
          flex:1;
          background: yellow;
        }
        .layout.flexbox .right{
          width: 300px;
          background: blue;
        }
</style>

<style>
        .layout.table .left-center-right{    //表格佈局
          width:100%;
          height: 100px;
          display: table;
        }
        .layout.table .left-center-right>div{
          display: table-cell;
        }
        .layout.table .left{
          width: 300px;
          background: red;
        }
        .layout.table .center{
          background: yellow;
        }
        .layout.table .right{
          width: 300px;
          background: blue;
        }
</style>

2、html5有哪些新特性

    字型樣式、圓角、視訊、音訊、canvas、svg、sessionstorge、localstorage........

3、css3位移怎麼做

   transform:translate(x,y)

4、垂直居中有幾種方法？

  定位，表格下（text-justify），display:flex(又問具體實現的屬性叫什麼...突然忘了，想了好一會兒，align-item,text-justify)

5、如何提升網站效能？SEO優化？

  減少http請求；圖片、樣式、js壓縮再使用；使用cdn；樣式、指令碼儘量使用外鏈；減少dom操作；html語義化；

  網站頭部title,keywords,description正確描述；html語義化；

6、js裡面關於陣列的操作有哪些？

     jion;concat;pop;push;splice;slice;

7、js陣列操作pop返回值是什麼？push操作返回值是什麼？

   pop返回刪掉陣列最後的那個元素;push增加元素返回長度。。。

8、http協議返回碼的含義

   4xx：客戶端錯了；5xx：服務端錯了；2xx：成了

9、js深拷貝和淺拷貝的問題

<script type="text/javascript">
	var a={
		name:'aa'
	};
	var b = a;
	a.name = "cc";
	console.log(b.name); //淺拷貝cc
</script>

 個人淺理解，淺拷貝就是複製這個物件及屬性值，並沒有重新開一個記憶體出來，所以原來屬性變了複製過來的也跟著一起變；深拷貝，直接複製整個物件，開闢一個新的記憶體；

10、關於typeof

    console.log(typeof(a))                 //object    console.log(typeof('a'))               //string    console.log(typeof(1))                //number    console.log(typeof(null))                //object    console.log(typeof(undefined))     //undefined    console.log(typeof(false))             //boolean

11、關於null、undefined

12、js變數的提升

13、js作用域

14、js原型與原型鏈

15、for迴圈 （。。錯了）

16、settimeout

17、js回收垃圾

18、陣列去重

19、陣列查重

20、單例模式和觀察者模式用程式碼表示出來（我一臉懵逼，這我要怎麼用程式碼描述。。。）

21、兩個陣列相加（做錯了）

22、js繼承

     構造繼承、原型繼承

     攜程面試題，可是我也不知道當時在抽什麼風，建構函式居然寫不出來，我估計是去搞笑的，生生浪費了這次機會