Vue component构造函数（Day20）

VueComponent

1. 组件本质为一个名为VueComponent的构造函数，且其并非程序员进行定义，由Vue.extend生成

2. 程序员只需写组件的单标签或双标签，Vue解析时会自动创建该组件的实例对象，即：Vue自动执行new Vue.component(options)构造函数

3. 注意： 每次调用Vue.extend，返回的都是一个全新的VueComponent

4. this指向问题：

   1. 组件配置中：

      data函数、methods函数、watch函数 、computed中的函数，它们的this均为VueComponent（vc）实例对象

   2. new Vue(options)配置中：

      data函数、methods函数、watch函数 、computed中的函数，它们的this均为Vue实例对象

5. VueComponent的实例对象：简称VC，称为组件实例对象；Vue的实例对象简称vm

内置关系

原理演示

 // 定义一个Dame构造函数
 function Demo(){
 this.a=1;
 this.b=2;
 }
 // 创建一个Demo实例对象
 const  d=new Demo();
 //显示原型属性 程序员使用，原型享有
 console.log(Demo.prototype);
 // 隐式原型属性 程序执行时自行查找，实例所有
 console.log(d.__proto__);
 // 程序员通过显示原型属性操作原型对象，追加一个x属性，值为99
 Demo.prototype.x=99;
 console.log(d);

1. VueComponent.protoytpe.proto===Vue.protoytpe

2. 有此关系的原因：让组件实例对象（vc）可以访问到Vue原型上的属性、方法

隐式原型属性永远指向其缔造者的原型对象