原标题：深入Vuex原理（上）
孔维国2016年加入去哪儿网技术团队。目前在大住宿事业部/增值业务研发中心参与开发了TMC、CRM、QTA、Auth等项目，负责node框架nomi的设计以及开发乐于探索布噵新技术，在大前端的道路上越走越偏！在node领域上越陷越深！
Vuex 作为 Vue 生态的重要组成部分是对 store 进行管理的一柄利剑。简而言之Vuex 是 Vue 的状态管理器。使用 Vuex 可用使数据流变得清晰、可追踪、可预测更可以简单的实现类似时光穿梭等高级功能，对于复杂的大型应用来讲Vuex 将变得尤为重要，对于 store 的切分、store 的 module 化、store 的变更、store 的追踪等等store 的管理工作，使用 Vuex 管理 store 会大大提高项目的稳定性、扩展性本篇将通过 Vuex 的源码对 Vuex 的設计以及实现原理进行剖析！
注：本篇文章只展示关键核心代码，一来由于篇幅原因二来展示核心代码更容易让人理解。再者本篇属於 Vuex 高级篇，对于本篇章中涉及的 Vue 相关的机制 以及 Vuex的高级使用等不进行过多赘述，请自行前往官网查看
准备浅析Vuex的构成
Vuex 的使用方式很简單，具体使用细节请参见 Vuex 官网本文为了剖析源码方便，只进行简单介绍我们只需要利用 Vue 的 use 机制将 实例化后的 store 类 对象 实例 注入 Vue 实例即可。如下图：
我们在使用 Vuex 对 store 进行管理的同时不禁会问： （1）Vuex 的 store 是如何注入到组件中的？ （2）Vuex 的 state 和 getter 是如何映射到各个组件实例中自动更新的 本篇章旨在解决以上疑问，让我们一起深入 Vuex 的原理揭开 Vuex 的神秘面纱吧！
本部分将针对以上疑问，通过源码分析剖析核心代码，对问題进行解答
疑问：Vuex的store是如何注入到组件中的？
要解答这个问题我们先从 Vuex 的使用表象上着手，从上面的介绍我们知道使用 Vuex 之前我们要對 Vuex 进行安装。核心代码如下：
上面的代码得益于 Vue 的插件机制会在调用 Vuex 的 install 方法时，装载 Vuex所以我们直接关注 install 方法的实现，其核心代码如下：
该代码的核心问题是 this 的指向得益于 mixin 机制，this 将指向 Vue 组件实例最终，我们可以在 Vue 组件实例上获得 Vuex 的 store 类 对象 实例的引用 $store图示如下：
分析臸此，我们已经得出该问题的答案
