vue组件的初步理解

我一直很疑惑，什么是组件。
首先看官方文档的介绍。啥？一大堆，反正我以前没有看懂。不过他有一句，--------》|所有的 Vue 组件同时也都是 Vue 的实例  
这句我懂了。 //1. 全局组件 
vue的实例
那么也就是说，组件和new Vue（{}）出来的是一个东西。所以。组件里面也有 ，data, methods ，template,created. mounted, computed,components 这些选项对象和钩子函数然后，文档里面还有一句： 组件可以扩展 HTML 元素 这句什么意思？
我们组件里面有template属性，于是可以这样
 template : ` <div id="box"> 我是一个div啊啊</div>`
这不，组件就能扩展html了吗？
再看看文档，看看有哪些方式能够定义组件。
        //1. 全局组件         Vue.component('All',             {              data : function(){                  return{}              },              methods: {              },              template :  ` <div  id="box"> 我是一个div啊啊</div>`,              components : {              }            }) //当然，还有很多属性computed，mounted我就不写了

//2. 局部组件 ，

var Child = {
template: '<div>我是局部组件。</div>'

}

那么最粗浅的理解，现在看来只要包含 data, template,created. mounted 
还有对应扩展的html等一系列的东西，就可以称为vue组件。

组件一直都写在template里面不太好吧，万一多起来，岂不是要命。

       //于是                <template id='local'>            <div>我是欢快的局部组件。</div>        </template>          var Local = {            data : function(){              return{}              },              template: '#local'          }


那么全局组件和局部组件有什么区别呢？
在一个项目里面，例如 局部组件B 比 全局组件 后定义 ，那么就能在这个 B组件 里面用全局组件

 3.  Vue.extend({}) 这样定义的组件。好像已经不推荐使用了哦。