vuex 源码：源码系列解读总结

前言

vuex 源码系列总共有 9 篇文章，主要围绕着 vuex 的 state、getter、mutation、action 和 module 来解读。一方面可以帮助到读者更加了解 vuex，另一方面也帮助自己提升了阅读源码的能力。

顺便安利一下作者的 Github 仓库：github.com/cobish/code…，欢迎 star，臣不胜受恩感激。

全目录

1. vuex 源码：如何实现一个简单的 vuex
2. vuex 源码：初探 vuex 之 install
3. vuex 源码：深入 vuex 之 state
4. vuex 源码：深入 vuex 之 getter
5. vuex 源码：深入 vuex 之 mutation
6. vuex 源码：深入 vuex 之 action
7. vuex 源码：深入 vuex 之 module
8. vuex 源码：深入 vuex 之 namespaced
9. vuex 源码：深入 vuex 之辅助函数 mapState

初衷

说实话，刚开始的时候我也没想到自己能够坚持下来。根据以往的经验，我都是半途而废的。无论是 jquery 源码，还是 underscore 源码，我都没能坚持。

细想了一下原因，有这么几个因素吧：

• jquery 和 underscore 功能模块太多，代码量大，自己没能耐心读完；
• 日常工作中比较少用到 underscore，jquery 使用到的也是一直几个方法；
• vuex 在日常工作中使用到的频率不低；
• vuex 代码量小，功能模块不多，代码简洁易懂。

对于作者来说，vuex 的源码更易阅读完成。

简单讲解

vue 官网有一个 bus 的实现，bus 就是 new 出来了一个 vue 实例，利用 vue 的 data 响应，将其挂载在根实例下，这便是 vuex 的雏形了。

在此基础之上，state 与 data 对应，getter 与 computed 对应，实现了 跨组件的状态获取。再规定了 mutation 和 action，分别用来同步和异步修改状态。最后加上 module 来实现命名空间。

这也就是 vuex 的核心概念原理。当然这里没有深入例如插件的其它源码。

最后

这是作者第一次完整地阅读完一个开源库，总结出的文章难免会有些错误。若读者发现，请联系作者，谢谢。PS：墙裂建议在阅读文章的时候，同时打开 vuex 的代码，文章中的代码只是冰山一角，并不能让读者看到整座冰山。临表涕零，不知所言。