vue 接收函数返回值_这几个小技巧，让你书写不一样的Vue！

前言

最近一直在阅读Vue的源码，发现了几个实战中用得上的小技巧，下面跟大家分享一下。
同时也可以阅读我之前写的Vue文章

• vue开发中的"骚操作"
• 挖掘隐藏在源码中的Vue技巧！
• 抽丝剥茧般的阅读源码，将$nextTick()拉下神坛！

隐藏在源码中的技巧

在实例化Vue时，首先调用的是Vue.prototype._init方法，而在此方法中mergeOptions()方法返回的options将运用在所有的初始化函数中。也就是如下代码：

vm.$options = mergeOptions( resolveConstructorOptions(vm.coustructor), options || {}, vm) 

其中mergeOptions方法在core/util/options.js文件中，最后这个方法返回的是一个options对象。

return options

这就说明了mergeOptions方法最终将合并处理后的选项返回，并以该返回值作为vm.$options的值。

自定义选项的合并方法

如果我们在options中添加自定义的属性会怎么样？来自官方的例子：

new Vue({
      
    customOption: 'foo',  
    created: function () {
        
        console.log(this.$options.customOption) // => 'foo'  
    }
})

在创建Vue实例的时候传递了一个自定义选项：customOptions，在created中可以通过this.$options.customOption进行访问。原理其实就是使用mergeOptions函数对自定义选项进行合并处理。对于自定义选项的合并，采用的是默认的合并策略：

// 当一个选项没有对应的策略函数时，使用默认策略
const strat = strats[key] || defaultStrat

defaultStrat函数就定义在options.js文件内，源码如下

/** * Default strategy. */
const defaultStrat = function (parentVal: any, childVal: any): any { return childVal === undefined ? parentVal : childVal}

defaultStart作用如其名，它是一个默认的合并策略：只要子选项不是undefined则使用子选项，否则使用父选项。最终的效果就是你初始化了什么，得到的就是什么。

而且Vue也提供了一个全局配置叫Vue.config.optionMergeStrategies，这个对象就是选项合并中的策略对象，所以可以通过它指定某一个选项的合并策略，常用于指定自定义选项的合并策略，比如可以给customOption