有些同學(xué)可能會(huì)問(wèn)敬飒，為什么不直接從 JSX 直接渲染構(gòu)造 DOM 結(jié)構(gòu)阱穗，而是要經(jīng)過(guò)中間這么一層呢罢屈？
第一個(gè)原因是，當(dāng)我們拿到一個(gè)表示 UI 的結(jié)構(gòu)和信息的對(duì)象以后，不一定會(huì)把元素渲染到瀏覽器的普通頁(yè)面上绝淡，我們有可能把這個(gè)結(jié)構(gòu)渲染到 canvas 上宙刘，或者是手機(jī) App 上。所以這也是為什么會(huì)要把 react-dom 單獨(dú)抽離出來(lái)的原因牢酵，可以想象有一個(gè)叫 react-canvas 可以幫我們把 UI 渲染到 canvas 上悬包，或者是有一個(gè)叫 react-app 可以幫我們把它轉(zhuǎn)換成原生的 App（實(shí)際上這玩意叫 ReactNative）。
第二個(gè)原因是馍乙，有了這樣一個(gè)對(duì)象布近。當(dāng)數(shù)據(jù)變化，需要更新組件的時(shí)候丝格，就可以用比較快的算法操作這個(gè) JavaScript 對(duì)象撑瞧，而不用直接操作頁(yè)面上的 DOM，這樣可以盡量少的減少瀏覽器重排显蝌，極大地優(yōu)化性能预伺。這個(gè)在以后的章節(jié)中我們會(huì)提到。
總結(jié)：
JSX 是 JavaScript 語(yǔ)言的一種語(yǔ)法擴(kuò)展曼尊，長(zhǎng)得像 HTML酬诀，但并不是 HTML。
React.js 可以用 JSX 來(lái)描述你的組件長(zhǎng)什么樣的骆撇。
JSX 在編譯的時(shí)候會(huì)變成相應(yīng)的 JavaScript 對(duì)象描述瞒御。
react-dom 負(fù)責(zé)把這個(gè)用來(lái)描述 UI 信息的 JavaScript 對(duì)象變成 DOM 元素，并且渲染到頁(yè)面上
