Vue.use()的原理分析

在平时的vue脚手架开发过程中，当我们安装一些插件的时候，我们总要在vue的main.js文件中使用Vue.use()方法。这就是use的常规操作。

Vue.use( plugin )  

{Object | Function} plugin

如果Vue.use() 中的参数是一个function函数，那么函数的参数是Vue对象。
如果Vue.use() 中的参数是一个Object对象，那么这个对象必须提供一个install方法，install方法的参数就是Vue。

那么Vue.use()方法的实现原理是什么呢？

源码如下：

Vue.use = function (plugin) {
    const installedPlugins = (this._installedPlugins || (this._installedPlugins = []))
    if (installedPlugins.indexOf(plugin) > -1) {
        return this
    }
 
    // additional parameters
    const args = toArray(arguments, 1)
    args.unshift(this)
    if (typeof plugin.install === 'function') {
        plugin.install.apply(plugin, args)
    } else if (typeof plugin === 'function') {
        plugin.apply(null, args)
    }
    installedPlugins.push(plugin)
    return this
}

该函数的第一步实现就是，先声明一个installedPlugins数组。用来存放安装过的插件。当新的插件安装后，首先会检查有没有安装过，也就是在installPlugins数组中能不能找到，如果能找到则表名已经安装过了，就直接返回vue实例。防止重复安装。

结下来就是将其他参数都通过toArray方法转化成数组，然后将vue实例放到数组的第一个位置，这是因为后续调用install方法都必须传入vue作为参数。

判断如果plugin对象的install是一个方法。那么就将参数传入并执行install方法，完成插件的安装。

判断如果plugin是一个方法，那么就把他当作是install方法来执行。

最后，将plugin压入到installedPlugin数组中，表示插件已经安装。

最后返回vue实例。

这就是vue.use的实现原理。