面試題：談談你對對vuex的理解

當面試官問咱們對vuex的理解的時候，咱們不能只說「vuex是一個專爲vue.js應用程序開發的狀態管理模式」，儘可能不要讓面試官連續追問（總會問到本身不會的而後說你實力還差那麼點來能夠得降薪），應該從三個方面一次性去說清楚：

1.vuex是什麼？

2.vuex的核心概念；

• vuex的屬性；
• vuex的數據傳遞流程；

3.爲何要用vuex？

 

　　對於問題一，咱們按官網的描述便可。vuex是一個專爲vue.js應用程序開發的狀態管理模式（它採用集中式存貯管理應用的全部組件的狀態，並以相應的規則保證狀態以一種可預測的方式發生變化）。

　　對於問題二，vuex五大核心屬性：state，getter，mutation，action，module

• state：存儲數據，存儲狀態；在根實例中註冊了store 後，用 this.$store.state 來訪問；對應vue裏面的data；存放數據方式爲響應式，vue組件從store中讀取數據，如數據發生變化，組件也會對應的更新。
• getter：能夠認爲是 store 的計算屬性，它的返回值會根據它的依賴被緩存起來，且只有當它的依賴值發生了改變纔會被從新計算。
• mutation：更改 Vuex 的 store 中的狀態的惟一方法是提交 mutation。
• action：包含任意異步操做，經過提交 mutation 間接更變狀態。
• module：將 store 分割成模塊，每一個模塊都具備state、mutation、action、getter、甚至是嵌套子模塊。

對於vuex的數據傳遞流程，以下圖所示：

當組件進行數據修改的時候咱們須要調用dispatch來觸發actions裏面的方法。actions裏面的每一個方法中都會有一個commit方法，當方法執行的時候會經過commit來觸發mutations裏面的方法進行數據的修改。mutations裏面的每一個函數都會有一個state參數，這樣就能夠在mutations裏面進行state的數據修改，當數據修改完畢後，會傳導給頁面。頁面的數據也會發生改變。

　　對於問題三，因爲傳參的方法對於多層嵌套的組件將會很是繁瑣，而且對於兄弟組件間的狀態傳遞無能爲力。咱們常常會採用父子組件直接引用或者經過事件來變動和同步狀態的多份拷貝。以上的這些模式很是脆弱，一般會致使代碼沒法維護。因此咱們須要把組件的共享狀態抽取出來，以一個全局單例模式管理。在這種模式下，咱們的組件樹構成了一個巨大的「視圖」，無論在樹的哪一個位置，任何組件都能獲取狀態或者觸發行爲！另外，經過定義和隔離狀態管理中的各類概念並強制遵照必定的規則，咱們的代碼將會變得更結構化且易維護。