在js中亦鳞，真實(shí)dom屬性太多崔梗，如果進(jìn)行比對(duì)需要的空間和時(shí)間都比較多触菜，所以用對(duì)象來(lái)代表一個(gè)真實(shí)dom扮授，一般是包含以下屬性的對(duì)象
<div>
hello<span>world!</span>
</div>
{
tag:'div',
data:{},
children:[],
text:undefined, //文本
ele:undefined, //真實(shí)節(jié)點(diǎn)
key: undefined,
attrs:[]
}
真實(shí)dom可以和虛擬dom之間轉(zhuǎn)換
新舊dom比較
image.png
比較新舊虛擬dom相似方法很簡(jiǎn)單
function sameVnode(oldNode, newNode){
return oldNode.key === newNode.key && oldNode.tag === newNode.tag
}
不相似則創(chuàng)建新的dom,相似則對(duì)oldNode打補(bǔ)丁躏筏，先比較class, style, attrs, events, props等板丽，不同則調(diào)用update函數(shù)，oldNode如果沒(méi)有新節(jié)點(diǎn)屬性則增加新節(jié)點(diǎn)屬性，子節(jié)點(diǎn)的比較用到了 diff算法埃碱，子節(jié)點(diǎn)比較遞歸打補(bǔ)丁猖辫。
參考文檔 虛擬dom比較原理
