1.什么是VNode?VNode作用是什么？

VNode又称Virtual DOM,VNode是一个类,一个通过属性描述DOM结构的对象
作用:当我们的业务越来越复杂时，就需要操作大量的DOM。而操作DOM是比较耗费性能的，所以我们需要通过VNode去比较DOM的变化，减少操作DOM。

var VNode = function VNode (
  tag,
  data,
  children,
  text,
  elm,
  context,
  componentOptions,
  asyncFactory
) {
  this.tag = tag; //标签
  this.data = data; //存放属性
  this.children = children; //子级
  this.text = text; //文本内容
  this.elm = elm; //真实DOM
  this.ns = undefined;
  this.context = context; //模板上下文对象
  this.fnContext = undefined;
  this.fnOptions = undefined;
  this.fnScopeId = undefined;
  this.key = data && data.key;
  this.componentOptions = componentOptions;
  this.componentInstance = undefined;
  this.parent = undefined;
  this.raw = false;
  this.isStatic = false;
  this.isRootInsert = true;
  this.isComment = false;
  this.isCloned = false;
  this.isOnce = false;
  this.asyncFactory = asyncFactory;
  this.asyncMeta = undefined;
  this.isAsyncPlaceholder = false;
};

从源代码可以看出，除了某些有效属性，其它属性都是undefined或者false

2.VNode的分类

空白节点即注释节点

<!--注释节点-->
var createEmptyVNode = function (text) {
  if ( text === void 0 ) text = '';

  var node = new VNode();
  node.text = text; //注释节点
  node.isComment = true;
  return node
};

空白节点

aaa
function createTextVNode (val) {
  return new VNode(undefined, undefined, undefined, String(val))
}

元素节点

vnode = new VNode(
    tag, data, children,
    undefined, undefined, context
  );
<span>111</span>
vnode = new VNode(
    'span', '', ['111'](其实是个VNode),
    undefined, undefined, context
  );

组件节点

有2个特殊属性:
componentOptions:组件节点的选项参数，包含tag,props等
componentInstance:组件的实例
比如<child></child>.tag就为child

VNode存放在哪里？

存放在_vnode中。可以通过打印vue实例查看。这个就是表示的当前DOM节点。也就是旧DOM。当我们有新节点需要比较更新时用的旧DOM就是这个，

VNode简介