1、vue特點

　　資料雙向繫結和元件化

2、說一下vue的資料雙向繫結的原理（v-model）

　　v-model是語法糖，包含兩個指令：v-bind、v-on。

　　用於資料雙向繫結，一般用於輸入框，他監聽著input事件，他綁定了value的屬性。

　　·注：具體回覆vue實現資料雙向繫結主要是：採用資料劫持結合釋出者-訂閱者模式的方式，通過Object.defineProperty()來劫持各個屬性的setter，getter，在資料變動時釋出訊息給訂閱者，觸發相應監聽回撥。

3、解釋單向資料流和雙向資料繫結

　　單向資料流：顧名思義，資料流是單向的。資料流動方向可以跟蹤。流動單一，追查問題時可以更便捷。

　　　　　　　　缺點是寫起來不太方便。要使UI發生變更就必須建立各種action來維護對應的state。

　　雙向資料繫結：資料之間是相通的。將資料變更的操作隱藏在框架內部。優點，在表單互動較多的場景下，會簡化大量與業務五關的程式碼。

　　　　　　　　缺點是無法追蹤區域性狀態的變化，加強出錯時debug的難度。

4、vue中如何去除url中的#

vue-router預設使用hash模式，所以在路由載入的時候，專案中的url會自帶#。如果不想使用#， 可以使用vue-router的另一種模式history

new Router({
  mode: 'history',
  routes: [ ]
})

　　需要注意的是，當我們啟用history模式的時候，由於我們的專案是一個單頁面應用，所以在路由跳轉的時候，就會出現訪問不到靜態資源而出現404的情況，這時候就需要服務端增加一個覆蓋所有情況的候選資源：如果URL匹配不到任何靜態資源，則應該返回同一個index.html頁面

5、對MVC、MVVM的理解

　　MVC

特點：

1. View傳送指令到Controller（控制器）
2. Controller完成業務邏輯後，要求Model（模型）改變狀態
3. Model將新的資料傳送到View，使用者得到反饋

所有通訊都是單向的。

　　MVVM

特點：

1. 各部分之間的通訊，都是雙向的
2. 採用雙向繫結：View
   的變動，自動反映在ViewModel，反之亦然

6、vue的生命週期

• beforeCreated()在例項建立之間執行，資料未載入狀態
• created()在例項建立、資料載入後，能初始化資料，dom渲染之前執行
• beforeMount()虛擬dom已建立完成，在資料渲染前最後一次更改資料
• mounted()頁面、資料渲染完成，真實dom掛載完成
• beforeUpadate()重新渲染之前觸發
• updated()資料已經更改完成，dom也重新render完成,更改資料會陷入死迴圈
• beforeDestory()和destoryed()前者是銷燬前執行（例項仍然完全可用），後者則是銷燬後執行

7、元件通訊

父傳子：將父元件的資料繫結到使用子元件的自定義標籤上，子元件在選項中新增一個props屬性來接 受資料；
子傳父：在響應該點選事件的函式中使用$emit來觸發一個自定義事件，並傳遞一個引數。

8、v-if 和 v-show 區別

　使用了v-if的時候，如果值為false，那麼頁面將不會有這個html標籤生成。

　v-show則是不管值為true還是false，html元素都會存在，只是CSS中的display顯示或隱藏

9、$route和$router的區別

　　$router為VueRouter例項，想要導航到不同URL，則使用$router.push方法

　　$route為當前router跳轉物件裡面可以獲取name、path、query、params等

10、NextTick 是做什麼的

　　　$nextTick是在下次DOM更新迴圈結束之後執行延遲迴調，在修改資料之後使用$nextTick，則可以在回撥中獲取更新後的DOM

11、Vue 元件 data 為什麼必須是函式

　　　因為js本身的特性帶來的，如果data是一個物件，那麼由於物件本身屬於引用型別，當我們修改其中的一個屬性時，會影響到所有Vue例項的資料。如果將data作為一個函式返回一個物件，那麼每一個例項的data屬性都是獨立的，不會相互影響了

12、計算屬性computed 和事件 methods 有什麼區別

　　computed: 計算屬性是基於它們的依賴進行快取的,只有在它的相關依賴發生改變時才會重新求值

　　method:只要發生重新渲染，method呼叫總會執行該函式

13、對比 jQuery ，Vue 有什麼不同

　　jQuery 專注檢視層，通過操作 DOM 去實現頁面的一些邏輯渲染； Vue 專注於資料層，通過資料的雙向繫結，最終表現在 DOM 層面，減少了 DOM 操作

　　Vue 使用了元件化思想，使得專案子集職責清晰，提高了開發效率，方便重複利用，便於協同開發

14、Vue 中怎麼自定義過濾器

　　可以用全域性方法Vue.filter()註冊一個自定義過濾器，它接收兩個引數：過濾器ID和過濾器函式。過濾器函式以值為引數，返回轉換後的值

15、Vue 中怎麼自定義指令

全域性註冊

// 註冊一個全域性自定義指令 `v-focus`
Vue.directive('focus', {
  // 當被繫結的元素插入到 DOM 中時……
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
})

區域性註冊

directives: {
  focus: {
    // 指令的定義
    inserted: function (el) {
      el.focus()
    }
  }
}

16、對 keep-alive 的瞭解

　　keep-alive是Vue內建的一個元件，可以使被包含的元件保留狀態，或避免重新渲染

17、Vue 中 key 的作用

　　key的特殊屬性主要用在Vue的虛擬DOM演算法，在新舊nodes對比時辨識VNodes。如果不使用key，Vue會使用一種最大限度減少動態元素並且儘可能的嘗試修復/再利用相同型別元素的演算法。使用key，它會基於key的變化重新排列元素順序，並且會移除key不存在的元素。

　　有相同父元素的子元素必須有獨特的key。重複的key會造成渲染錯誤

18、vue 等單頁面應用的優缺點

優點：

• 良好的互動體驗
• 良好的前後端工作分離模式
• 減輕伺服器壓力

缺點：

• SEO難度較高
• 前進、後退管理
• 初次載入耗時多