extend创建的是一个组件构造器，而不是一个具体的组件实例
//选项对象 baseOptions
let baseOptions= {
template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
data: function () {
return {
firstName: 'Walter',
lastName: 'White',
alias: 'Heisenberg'
}
},
created(){
console.log('onCreated-1');
}
};
使用：
1、extend常服务于Vue.component用来生成组件，这是注册全局组件，可以在任意实例的components里使用。
使用示例：全局提示组件，全局的网页底部，动态创建全局组件（插件 ），用Vue.extend构建消息提示组件。（网页底部组件：创建的组件的dom结构，直接在body底部插入，在vue的app实例范围外，创建之后，该组件仍然可以响应组件内的数据。）
Vue.component('global-component', Vue.extend(baseOptions));
//传入一个选项对象（自动调用 Vue.extend）,等价于上行代码.
Vue.component('global-component', baseOptions);
2、Vue.extend只是创建一个构造器,他是为了创建可复用的组件，在其它地方可以直接new。而mixins,extends是为了扩展组件属性，采用的方式是混合选项对象baseOptions
let BaseComponent = Vue.extend(baseOptions);
//基于基础组件BaseComponent,再扩展新逻辑.
new BaseComponent({
created(){
//do something
console.log('onCreated-2');
}
//其他自定义逻辑
});
// -> onCreated-1
// -> onCreated-2
它的混入规则，和mixins一样。详细查阅vue实例属性总结：根实例和组件实例
new Vue({
mixins: [baseOptions],
created(){
//do something
console.log('onCreated-2');
}
//其他自定义逻辑
});
// -> onCreated-1
// -> onCreated-2
extends：声明扩展另一个组件(可以是一个简单的选项对象或构造函数)。这主要是为了便于扩展单文件组件，与mixins 类似，剩下的差别大概是mixins接受数组，它是选项对象。
new Vue({
extends: baseOptions,
created(){
//do something
console.log('onCreated-2');
}
//其他自定义逻辑
});
// -> onCreated-1
// -> onCreated-2
3、创建一个vue的“子类”，使用new extend的构造函数，注册局部组件（局部组件也可以是单文件组件，使用导入的方式注册），局部组件在子组件中不可用。参数与Vue一样，注意：data选项是函数，没有el等实例才有的选项。new的实例使用的propsData，而不是props。
var author = Vue.extend({
template: "<p><a :href='url'>{{author}} & {{name}}</a></p>",
data : function() {
return {
author : 'vamous',
url : 'http://blog.csdn.net/Dear_Mr/article/details/72614370'
}
}，
props : ['name']
});
//对应html：自定义无参数标签
<author></author>
//必须要挂载才可以使用
//使用propsData给实例的props传递参数
new author({propsData: {name : 'dear_mr'}}).$mount('author');//对应html还可以是普通标签
<div id="author"></div>
//挂载方式
new author().$mount('#author');
extend写法不但要创建构造器，还要new一个实例，还要挂载到特定的元素上，这个特定元素最终还被完全替换了，不像component用起来那么舒服，注册好特定的名字之后，想在哪里用，就在哪里写组件名，程序还更易读。
所以说extend到底有什么优势呢？
生成的实例并不一定要”挂载到一个元素上”。
也就是 new 实例().$mount() 的参数可以为空，但他依旧能生成一个实例。生成的实例里面有$el这个参数，通过document.body.appendChild( 实例.$el），这个dom想插哪里插哪里。
component是extend的亲民版，但在实现某些特殊需求的时候，就需要用到extend，如alert组件，你肯定希望alert可以动态插入到body中，而不需要在dom文档流中放一个莫名其妙的alert，大部分时间他还是隐藏的。
Vue.nextTick( [callback, context] )：从2.1起，返回一个promise。在下次 DOM 更新循环结束之后（这是个什么场景？）执行延迟回调（这个回调在哪里传入？）。在修改数据之后立即使用这个方法，获取更新后的 DOM（获取拿来干嘛？）。
Vue.set( target, key, value )：向响应式对象中添加一个属性，并确保这个新属性同样是响应式的，且触发视图更新。注意对象不能是 Vue 实例，或者 Vue 实例的根数据对象。
在实例上的调用形式：vm.$set
使用场景：
1、vm实例创建后新添属性。
2、Vue 不能检测以下变动的数组（vue能检测到并触发视图更新的方法）：
a、当利用索引直接设置一个项时，例如：vm.items[indexOfItem] = newValue
解决：
（1）Vue.set(vm.items, indexOfItem, newValue)
（2）vm.items.splice(indexOfItem, 1, newValue)
（3）vm.$set(vm.items, indexOfItem, newValue)
b、当修改数组的长度时，例如：vm.items.length = newLength
解决：vm.items.splice(newLength)
Vue.delete( target, key )：删除对象的属性。如果对象是响应式的，确保删除能触发更新视图。这个方法主要用于避开 Vue 不能检测到属性被删除（这句话什么意思？），但是你应该很少会使用它。目标对象不能是一个 Vue 实例或 Vue 实例的根数据对象。
Vue.directive( id, [definition] )：注册或获取全局指令，见自定义指令。
//返回已注册的指令
var myDirective = Vue.directive('my-directive')
Vue.filter( id, [definition] )：注册或获取全局过滤器，查看博文vue构造器参数之filters过滤器。
Vue.component( id, [definition] )：注册或获取全局组件，Vue.component类是Vue类的子类，第一个参数是组件名称，建议使用小写+‘-’的形式，在使用时，也是这个形式。
// 注册组件，传入一个扩展过的构造器
Vue.component('my-component', Vue.extend({ /* ... */ }))// 注册组件，传入一个选项对象 (自动调用 Vue.extend)，等价于上行代码.
Vue.component('my-component', { /* ... */ })// 获取注册的组件 (始终返回构造器)
var MyComponent = Vue.component('my-component')
基础组件的自动化全局注册：解决每个文件一长串的import基础组件
import BaseButton from './BaseButton.vue'
import BaseIcon from './BaseIcon.vue'
import BaseInput from './BaseInput.vue'
自动注册，在new根实例之前：
使用 require.context 全局注册通用的基础组件。这里有一份可以让你在应用入口文件 (比如 src/main.js) 中全局导入基础组件的示例代码：
import Vue from 'vue'
import upperFirst from 'lodash/upperFirst'
import camelCase from 'lodash/camelCase'const requireComponent = require.context(
// 其组件目录的相对路径
'./components',
// 是否查询其子目录
false,
// 匹配基础组件文件名的正则表达式
/Base[A-Z]\w+\.(vue|js)$/
)requireComponent.keys().forEach(fileName => {
// 获取组件配置
const componentConfig = requireComponent(fileName) // 获取组件的 PascalCase 命名
const componentName = upperFirst(
camelCase(
// 剥去文件名开头的 `./` 和结尾的扩展名
fileName.replace(/^\.\/(.*)\.\w+$/, '$1')
)
) // 全局注册组件
Vue.component(
componentName,
// 如果这个组件选项是通过 `export default` 导出的，
// 那么就会优先使用 `.default`，
// 否则回退到使用模块的根。
componentConfig.default || componentConfig
)
})
Vue.use( plugin )：安装 Vue.js 插件，包括个人组件/插件。该方法需要在调用 new Vue() 之前被调用。
Vue.js 官方提供的一些插件 (例如 vue-router) 在检测到 Vue 是可访问的全局变量时会自动调用 Vue.use()。然而在例如 CommonJS 的模块环境中，要显式地调用 Vue.use()
Vue.compile( template )：编译的意思，在 render 函数（渲染函数）中编译模板字符串。只在独立构建时有效。
var res = Vue.compile('<div><span>{{ msg }}</span></div>')new Vue({
data: {
msg: 'hello'
},
render: res.render,
staticRenderFns: res.staticRenderFns
})
Vue.observable( object )：返回的对象可以直接用于渲染函数和计算属性内，并且会在发生改变时触发相应的更新。
在 Vue 3.x 中，返回一个可响应的代理，而对源对象直接进行修改仍然是不可响应的。因此，推荐操作返回的对象，而不是源对象。
