筆試題目：
這個面試官好嚇人。顯示筆試題做30分鐘。然後拿着一大本面試題。照着答案抽問我。懵逼。還是一家外包公司
==============
我的參考答案：
1. 題目可能有誤。應該是兩個div，一個是bigbox，一個是smallbox，圖中多了些莫名其妙的東西。
.bigbox{
position: relative;
}
.smallbox{
margin: auto;
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
overflow:auto
}
2. 清除浮動方法 在浮動元素後使用一個空元素如 <div class="clear"></div> ，並在CSS中賦予 .clear{clear:both;} 屬性即可清理浮動。
3. 寬高都是142
4. 選擇器類型：①通用元素選擇器 ②類型選擇器 ③class選擇器④id選擇器
可以繼承的屬性（隨便寫四個，不要寫太全了）：1、字體系列屬性 2、文本系列屬性 3、元素可見性：visibility 4、表格佈局屬性：caption-side 5、列表屬性：list-style-type 6、設置嵌套引用的引號類型：quotes
優先級： 下面列表中，選擇器類型的優先級是遞增的：類型選擇器< class選擇器< id選擇器 給元素添加的內聯樣式 (例如，style="font-weight:bold") 總會覆蓋外部樣式表的任何樣式 ，因此可看作是具有最高的優先級。 當在一個樣式聲明中使用一個 !important 規則時，此聲明將覆蓋任何其他聲明
5. 常用的有Sass、Less 和 Stylus 這三種 css 預處理器。使用的好處：彌補了直接寫 css 的一些缺憾：
語法不夠強大，比如無法嵌套書寫導致模塊化開發中需要書寫很多重複的選擇器；
沒有變量和合理的樣式複用機制，使得邏輯上相關的屬性值必須以字面量的形式重複輸出，導致難以維護。
6. 實現響應式佈局有以下幾種方法：
1. 媒體查詢
CSS3媒體查詢可以讓我們針對不同的媒體類型定義不同的樣式，當重置瀏覽器窗口大小的過程中，頁面也會根據瀏覽器的寬度和高度重新渲染頁面。
2.百分比佈局
通過百分比單位，可以使得瀏覽器中組件的寬和高隨着瀏覽器的高度的變化而變化，從而實現響應式的效果。
3.rem佈局
REM是CSS3新增的單位，並且移動端的支持度很高，
7. 相同點：都是存儲數據，存儲在web端，並且都是同源
不同點：
（1）cookie 只有4K 小 並且每一次請求都會帶上cookie 體驗不好，浪費帶寬
（2）session和local直接存儲在本地，請求不會攜帶，並且容量比cookie要大的多
（3）session 是臨時會話，當窗口被關閉的時候就清除掉 ，而 local永久存在，cookie有過期時間
（4）cookie 和local都可以支持多窗口共享，而session不支持多窗口共享 但是都支持a鏈接跳轉的新窗口
8. 基本類型：String、Number、Boolean、Symbol、Undefined、Null
判斷類型的5種方法：
1.使用typeof
2.使用instanceof
3.使用constructor：undefined和null沒有contructor屬性
4.使用Object.prototype.toString.call
5.使用jquery中的$.type
9. JavaScript實現繼承的方式：
類式繼承
構造函數繼承
組合繼承
寄生組合式繼承
extends繼承
10. 1、語法更加簡潔、清晰
2、箭頭函數不會創建自己的this
3、箭頭函數繼承而來的this指向永遠不變
4、.call()/.apply()/.bind()無法改變箭頭函數中this的指向
5、箭頭函數不能作爲構造函數使用
6、箭頭函數沒有自己的arguments
7、箭頭函數沒有原型prototype
8、箭頭函數不能用作Generator函數，不能使用yeild關鍵字
11. 利用filter去重
function unique(arr) {
return arr.filter(function(item, index, arr) {
//當前元素，在原始數組中的第一個索引==當前索引值，否則返回當前元素
return arr.indexOf(item, 0) === index;
});
}
12 第一個： 01234
第二個：12435
筆試後問到的技術問題：
1.vuejs的生命週期？
什麼是 vue 生命週期？有什麼作用？
答：每個 Vue 實例在被創建時都要經過一系列的初始化過程——例如，需要設置數據監聽、編譯模板、將實例掛載到 DOM 並在數據變化時更新 DOM 等。同時在這個過程中也會運行一些叫做 生命週期鉤子 的函數，這給了用戶在不同階段添加自己的代碼的機會。（ps：生命週期鉤子就是生命週期函數）例如，如果要通過某些插件操作DOM節點，如想在頁面渲染完後彈出廣告窗， 那我們最早可在mounted 中進行。
請詳細說下你對vue生命週期的理解？
答：總共分爲8個階段創建前/後，載入前/後，更新前/後，銷燬前/後。
創建前/後： 在beforeCreated階段，vue實例的掛載元素$el和**數據對象**data都爲undefined，還未初始化。在created階段，vue實例的數據對象data有了，$el還沒有。
載入前/後：在beforeMount階段，vue實例的$el和data都初始化了，但還是掛載之前爲虛擬的dom節點，data.message還未替換。在mounted階段，vue實例掛載完成，data.message成功渲染。
更新前/後：當data變化時，會觸發beforeUpdate和updated方法。
銷燬前/後：在執行destroy方法後，對data的改變不會再觸發週期函數，說明此時vue實例已經解除了事件監聽以及和dom的綁定，但是dom結構依然存在。
2.vuejs的傳值有哪些方式？
3.vuejs的監聽和計算屬性介紹一下？
分別簡述computed和watch的使用場景
答：computed:
當一個屬性受多個屬性影響的時候就需要用到computed
最典型的栗子： 購物車商品結算的時候
watch:
當一條數據影響多條數據的時候就需要用watch
栗子：搜索數據
4.項目怎麼優化的？
你如何優化自己的代碼？
代碼重用
避免全局變量（命名空間，封閉空間，模塊化mvc..）
拆分函數避免函數過於臃腫
註釋
5.js的基本數據類型和引用數據類型。及區別？
JS分兩種數據類型：
基本數據類型：Number、String、Boolean、Null、 Undefined、Symbol（ES6），這些類型可以直接操作保存在變量中的實際值。
引用數據類型：Object（在JS中除了基本數據類型以外的都是對象，數據是對象，函數是對象，正則表達式是對象）
6.vuejs的路由傳參方式？
7.同步和異步有什麼區別？
同步
所有的操作都做完，才返回給用戶。這樣用戶在線等待的時間太長，給用戶一種卡死了的感覺（就是系統遷移中，點擊了遷移，界面就不動了，但是程序還在執行，卡死了的感覺）。這種情況下，用戶不能關閉界面，如果關閉了，即遷移程序就中斷了。
異步
將用戶請求放入消息隊列，並反饋給用戶，系統遷移程序已經啓動，你可以關閉瀏覽器了。然後程序再慢慢地去寫入數據庫去。這就是異步。但是用戶沒有卡死的感覺，會告訴你，你的請求系統已經響應了。你可以關閉界面了。
同步，是所有的操作都做完，才返回給用戶結果。即寫完數據庫之後，再響應用戶，用戶體驗不好。
異步，不用等所有操作都做完，就相應用戶請求。即先響應用戶請求，然後慢慢去寫數據庫，用戶體驗較好。
異步操作例子
爲了避免短時間大量的數據庫操作，就使用緩存機制，也就是消息隊列。先將數據放入消息隊列，然後再慢慢寫入數據庫。
引入消息隊列機制，雖然可以保證用戶請求的快速響應，但是並沒有使得我數據遷移的時間變短（即80萬條數據寫入mysql需要1個小時，用了redis之後，還是需要1個小時，只是保證用戶的請求的快速響應。用戶輸入完http url請求之後，就可以把瀏覽器關閉了，幹別的去了。如果不用redis，瀏覽器不能關閉）。
同步就沒有任何價值了嗎？
銀行的轉賬功能。
8.