vuex源碼分析

本文適合有必定基礎的同窗閱讀，主要探究vuex的源碼結構，有那幾部分組成，每部分承擔的職責，每部分之間的關係。以及部分代碼細節，和編程技巧。

本文主要針對代碼結構和設計，畫圖作抽象思考。代碼細節請查看文末參考資料，很是詳盡和仔細。

vuex應用概覽圖

vuex源碼類圖

主要描述Store, ModuleCollection, Module三個類，以及它們之間的關係

比較核心的是Store類，核心的安裝模塊方法（用到ModuleCollection類），初始化store._vm方法，都在其中

store對象

store對象的結構與源碼中store類的構造函數中是一一對應的，若是有不在構造函數中的，則是分散在部分實例方法中作賦值的，例如 store._vm屬性。有興趣的能夠一一比較分析，

1.store._modules是ModuleCollection實例，ModuleCollection用到Module類，本質是構造一個Module樹
2.分module的state，本質上被構造爲state樹，做爲store._vm._data.$$state
3.store._modulesNamespaceMap是namespace -> module映射，用於按namespace快速查找對應module

什麼最重要，數據結構最重要，只有你定義出合理的數據結構，才能知足你的功能需求，它是基石也是核心。

store對象

store中的vm實例對象

vuex輔助函數

相關資料

https://zhuanlan.zhihu.com/p/...

https://github.com/dwqs/blog/...

https://github.com/answershut...

https://segmentfault.com/a/11... 這個主要是講代碼細節，也不錯

https://zhuanlan.zhihu.com/p/... 這個強烈推薦，既講代碼結構和功能設計，又講代碼細節。