export function install(_Vue) {
    // vue.use原理：调用插件的install方法进行插件注册，并向install方法传递Vue对象作为第一个参数
    if (Vue && _Vue === Vue) {
        if (process.env.NODE_ENV !== "production") {
            console.error(
                "[vuex] already installed. Vue.use(Vuex) should be called only once."
            );
        }
        return;
    }
    Vue = _Vue; // 为了引用vue的watch方法
    applyMixin(Vue);
}

function vuexInit() {
    const options = this.$options;
    // store injection
    if (options.store) {
        this.$store =
            typeof options.store === "function"
                ? options.store()
                : options.store;
    } else if (options.parent && options.parent.$store) {
        this.$store = options.parent.$store;
    }
}

if (!Vue && typeof window !== "undefined" && window.Vue) {
    install(window.Vue);
}

if (process.env.NODE_ENV !== "production") {
    assert(Vue, `must call Vue.use(Vuex) before creating a store instance.`);
    assert(
        typeof Promise !== "undefined",
        `vuex requires a Promise polyfill in this browser.`
    );
    assert(
        this instanceof Store,
        `store must be called with the new operator.`
    );
}

const { plugins = [], strict = false } = options;

// store internal state
this._committing = false; // 是否在进行提交mutation状态标识
this._actions = Object.create(null); // 保存action，_actions里的函数已经是经过包装后的
this._actionSubscribers = []; // action订阅函数集合
this._mutations = Object.create(null); // 保存mutations，_mutations里的函数已经是经过包装后的
this._wrappedGetters = Object.create(null); // 封装后的getters集合对象
// Vuex支持store分模块传入，在内部用Module构造函数将传入的options构造成一个Module对象，
// 如果没有命名模块，默认绑定在this._modules.root上
// ModuleCollection 内部调用 new Module构造函数
this._modules = new ModuleCollection(options);
this._modulesNamespaceMap = Object.create(null); // 模块命名空间map
this._subscribers = []; // mutation订阅函数集合
this._watcherVM = new Vue(); // Vue组件用于watch监视变化

const store = this;
const { dispatch, commit } = this;
/**
 把 Store 类的 dispatch 和 commit 的方法的 this 指针指向当前 store 的实例上.
 这样做的目的可以保证当我们在组件中通过 this.$store 直接调用 dispatch/commit 方法时,
 能够使 dispatch/commit 方法中的 this 指向当前的 store 对象而不是当前组件的 this.
*/
this.dispatch = function boundDispatch(type, payload) {
    return dispatch.call(store, type, payload);
};
this.commit = function boundCommit(type, payload, options) {
    return commit.call(store, type, payload, options);
};

//options中传入的是否启用严格模式
this.strict = strict;

// new ModuleCollection 构造出来的_mudules
const state = this._modules.root.state;

// 初始化组件树根组件、注册所有子组件，并将其中所有的getters存储到this._wrappedGetters属性中
installModule(this, state, [], this._modules.root);

//通过使用vue实例，初始化 store._vm，使state变成可响应的，并且将getters变成计算属性
resetStoreVM(this, state);

// 注册插件
plugins.forEach(plugin => plugin(this));

// 调试工具注册
const useDevtools =
    options.devtools !== undefined ? options.devtools : Vue.config.devtools;
if (useDevtools) {
    devtoolPlugin(this);
}

const childModule = {
  state: { ... },
  mutations: { ... },
  actions: { ... }
}

const store = new Vuex.Store({
  state,
  getters,
  actions,
  mutations,
  modules: {
    childModule: childModule,
  }
})

export default class ModuleCollection {
    constructor(rawRootModule) {
        // 注册根module，参数是new Vuex.Store时传入的options
        this.register([], rawRootModule, false);
    }

    register(path, rawModule, runtime = true) {
        if (process.env.NODE_ENV !== "production") {
            assertRawModule(path, rawModule);
        }

        const newModule = new Module(rawModule, runtime);
        if (path.length === 0) {
            // 注册根module
            this.root = newModule;
        } else {
            // 注册子module，将子module添加到父module的_children属性上
            const parent = this.get(path.slice(0, -1));
            parent.addChild(path[path.length - 1], newModule);
        }

        // 如果当前模块有子modules，循环注册
        if (rawModule.modules) {
            forEachValue(rawModule.modules, (rawChildModule, key) => {
                this.register(path.concat(key), rawChildModule, runtime);
            });
        }
    }
}

constructor (rawModule, runtime) {
    // 初始化时为false
    this.runtime = runtime
    // 存储子模块
    this._children = Object.create(null)
    // 将原来的module存储，以备后续使用
    this._rawModule = rawModule
    const rawState = rawModule.state
    // 存储原来module的state
    this.state = (typeof rawState === 'function' ? rawState() : rawState) || {}
  }

function installModule(store, rootState, path, module, hot) {
    // 判断是否是根节点，跟节点的path = []
    const isRoot = !path.length;

    // 取命名空间，形式类似'childModule/'
    const namespace = store._modules.getNamespace(path);

    // 如果namespaced为true，存入_modulesNamespaceMap中
    if (module.namespaced) {
        store._modulesNamespaceMap[namespace] = module;
    }

    // 不是根节点，把子组件的每一个state设置到其父级的state属性上
    if (!isRoot && !hot) {
        // 获取当前组件的父组件state
        const parentState = getNestedState(rootState, path.slice(0, -1));
        // 获取当前Module的名字
        const moduleName = path[path.length - 1];
        store._withCommit(() => {
            Vue.set(parentState, moduleName, module.state);
        });
    }

    // 给context对象赋值
    const local = (module.context = makeLocalContext(store, namespace, path));

    // 循环注册每一个module的Mutation
    module.forEachMutation((mutation, key) => {
        const namespacedType = namespace + key;
        registerMutation(store, namespacedType, mutation, local);
    });

    // 循环注册每一个module的Action
    module.forEachAction((action, key) => {
        const type = action.root ? key : namespace + key;
        const handler = action.handler || action;
        registerAction(store, type, handler, local);
    });

    // 循环注册每一个module的Getter
    module.forEachGetter((getter, key) => {
        const namespacedType = namespace + key;
        registerGetter(store, namespacedType, getter, local);
    });

    // 循环_childern属性
    module.forEachChild((child, key) => {
        installModule(store, rootState, path.concat(key), child, hot);
    });
}

function makeLocalContext(store, namespace, path) {
    // 是否有命名空间
    const noNamespace = namespace === "";

    const local = {
        // 如果没有命名空间，直接返回store.dispatch；否则给type加上命名空间，类似'childModule/'这种
        dispatch: noNamespace
            ? store.dispatch
            : (_type, _payload, _options) => {
                  const args = unifyObjectStyle(_type, _payload, _options);
                  const { payload, options } = args;
                  let { type } = args;

                  if (!options || !options.root) {
                      type = namespace + type;
                      if (
                          process.env.NODE_ENV !== "production" &&
                          !store._actions[type]
                      ) {
                          console.error(
                              `[vuex] unknown local action type: ${
                                  args.type
                              }, global type: ${type}`
                          );
                          return;
                      }
                  }

                  return store.dispatch(type, payload);
              },
        // 如果没有命名空间，直接返回store.commit；否则给type加上命名空间
        commit: noNamespace
            ? store.commit
            : (_type, _payload, _options) => {
                  const args = unifyObjectStyle(_type, _payload, _options);
                  const { payload, options } = args;
                  let { type } = args;

                  if (!options || !options.root) {
                      type = namespace + type;
                      if (
                          process.env.NODE_ENV !== "production" &&
                          !store._mutations[type]
                      ) {
                          console.error(
                              `[vuex] unknown local mutation type: ${
                                  args.type
                              }, global type: ${type}`
                          );
                          return;
                      }
                  }

                  store.commit(type, payload, options);
              }
    };

    // getters and state object must be gotten lazily
    // because they will be changed by vm update
    Object.defineProperties(local, {
        getters: {
            get: noNamespace
                ? () => store.getters
                : () => makeLocalGetters(store, namespace)
        },
        state: {
            get: () => getNestedState(store.state, path)
        }
    });

    return local;
}

function registerMutation(store, type, handler, local) {
    const entry = store._mutations[type] || (store._mutations[type] = []);
    entry.push(function wrappedMutationHandler(payload) {
        // 将this指向store，将makeLocalContext返回值中的state作为第一个参数，调用值执行的payload作为第二个参数
        // 因此我们调用commit去提交mutation的时候，可以从mutation的第一个参数中取到当前的state值。
        handler.call(store, local.state, payload);
    });
}

function registerAction(store, type, handler, local) {
    const entry = store._actions[type] || (store._actions[type] = []);
    entry.push(function wrappedActionHandler(payload, cb) {
        //与mutation不同，action的第一个参数是一个对象，里面包含dispatch、commit、getters、state、rootGetters、rootState
        let res = handler.call(
            store,
            {
                dispatch: local.dispatch,
                commit: local.commit,
                getters: local.getters,
                state: local.state,
                rootGetters: store.getters,
                rootState: store.state
            },
            payload,
            cb
        );
        if (!isPromise(res)) {
            res = Promise.resolve(res);
        }
        if (store._devtoolHook) {
            return res.catch(err => {
                store._devtoolHook.emit("vuex:error", err);
                throw err;
            });
        } else {
            return res;
        }
    });
}

function registerGetter(store, type, rawGetter, local) {
    // getters不允许重复
    if (store._wrappedGetters[type]) {
        if (process.env.NODE_ENV !== "production") {
            console.error(`[vuex] duplicate getter key: ${type}`);
        }
        return;
    }

    store._wrappedGetters[type] = function wrappedGetter(store) {
        // getters的第一个参数包含local state、local getters、root state、root getters
        return rawGetter(
            local.state, // local state
            local.getters, // local getters
            store.state, // root state
            store.getters // root getters
        );
    };
}

  // 提交mutation函数
  commit(_type, _payload, _options) {
    // check object-style commit
    //commit支持两种调用方式，一种是直接commit('getName','vuex'),另一种是commit({type:'getName',name:'vuex'}),
    //unifyObjectStyle适配两种方式
    const { type, payload, options } = unifyObjectStyle(
      _type,
      _payload,
      _options
    );

    const mutation = { type, payload };
    // 这里的entry取值就是我们在registerMutation函数中push到_mutations中的函数，已经经过处理
    const entry = this._mutations[type];
    if (!entry) {
      if (process.env.NODE_ENV !== "production") {
        console.error(`[vuex] unknown mutation type: ${type}`);
      }
      return;
    }

    // 专用修改state方法，其他修改state方法均是非法修改，在严格模式下，无论何时发生了状态变更且不是由 mutation 函数引起的，将会抛出错误
    // 不要在发布环境下启用严格模式！严格模式会深度监测状态树来检测不合规的状态变更——请确保在发布环境下关闭严格模式，以避免性能损失。
    this._withCommit(() => {
      entry.forEach(function commitIterator(handler) {
        handler(payload);
      });
    });

    // 订阅者函数遍历执行，传入当前的mutation对象和当前的state
    this._subscribers.forEach(sub => sub(mutation, this.state));

    if (process.env.NODE_ENV !== "production" && options && options.silent) {
      console.warn(
        `[vuex] mutation type: ${type}. Silent option has been removed. ` +
          "Use the filter functionality in the vue-devtools"
      );
    }
  }

_withCommit(fn) {
    // 保存之前的提交状态false
    const committing = this._committing;

    // 进行本次提交，若不设置为true，直接修改state，strict模式下，Vuex将会产生非法修改state的警告
    this._committing = true;

    // 修改state
    fn();

    // 修改完成，还原本次修改之前的状态false
    this._committing = committing;
}

// 触发action函数
  dispatch(_type, _payload) {
    // check object-style dispatch
    const { type, payload } = unifyObjectStyle(_type, _payload);

    const action = { type, payload };
    const entry = this._actions[type];
    if (!entry) {
      if (process.env.NODE_ENV !== "production") {
        console.error(`[vuex] unknown action type: ${type}`);
      }
      return;
    }

    // 执行所有的订阅者函数
    this._actionSubscribers.forEach(sub => sub(action, this.state));

    return entry.length > 1
      ? Promise.all(entry.map(handler => handler(payload)))
      : entry[0](payload);
  }

function resetStoreVM(store, state, hot) {
    //保存老的vm
    const oldVm = store._vm;

    // 初始化 store 的 getters
    store.getters = {};

    // _wrappedGetters 是之前在 registerGetter 函数中赋值的
    const wrappedGetters = store._wrappedGetters;

    const computed = {};

    forEachValue(wrappedGetters, (fn, key) => {
        // 将getters放入计算属性中，需要将store传入
        computed[key] = () => fn(store);
        // 为了可以通过this.$store.getters.xxx访问getters
        Object.defineProperty(store.getters, key, {
            get: () => store._vm[key],
            enumerable: true // for local getters
        });
    });

    // use a Vue instance to store the state tree
    // suppress warnings just in case the user has added
    // some funky global mixins
    // 用一个vue实例来存储store树，将getters作为计算属性传入，访问this.$store.getters.xxx实际上访问的是store._vm[xxx]
    const silent = Vue.config.silent;
    Vue.config.silent = true;
    store._vm = new Vue({
        data: {
            $$state: state
        },
        computed
    });
    Vue.config.silent = silent;

    // enable strict mode for new vm
    // 如果是严格模式，则启用严格模式，深度 watch state 属性
    if (store.strict) {
        enableStrictMode(store);
    }

    // 若存在oldVm，解除对state的引用，等dom更新后把旧的vue实例销毁
    if (oldVm) {
        if (hot) {
            // dispatch changes in all subscribed watchers
            // to force getter re-evaluation for hot reloading.
            store._withCommit(() => {
                oldVm._data.$$state = null;
            });
        }
        Vue.nextTick(() => oldVm.$destroy());
    }
}

function enableStrictMode(store) {
    store._vm.$watch(
        function() {
            return this._data.$$state;
        },
        () => {
            if (process.env.NODE_ENV !== "production") {
                assert(
                    store._committing,
                    `do not mutate vuex store state outside mutation handlers.`
                );
            }
        },
        { deep: true, sync: true }
    );
}