react中JSX是什麼

react JSX是一種JavaScript的語法擴展，運用於React架構中，其格式比較像是模版語言，但事實上完全是在JavaScript內部實現的；JSX為react.js開發的一套語法糖，也是react.js的使用基礎。

本文操作環境：windows10系統、react 16、thinkpad t480電腦。

推薦：《react影片教學》

react中JSX是什麼？

JSX即JavaScript XML，是Javascript和XML結合的一種格式。

JSX是一種JavaScript的語法擴展，運用於React架構中，其格式比較像是模版語言，但事實上完全是在JavaScript內部實現的。元素是構成React應用的最小單位，JSX就是用來宣告React當中的元素，React使用JSX來描述使用者介面。

JSX為react.js開發的一套語法糖，也是react.js的使用基礎。 React在不使用JSX的情況下一樣可以工作，然而使用JSX可以提高組件的可讀性，因此推薦使用JSX。

這個是官網：http://facebook.github.io/jsx/

#JSX的特點

##可以將HTML語言直接寫在JavaScript語言之中，不加任何引號，這就是JSX的語法，它允許HTML與JavaScript的混寫。

JSX允許直接在模板中插入JavaScript變數。如果這個變數是一個數組，則會展開這個數組的所有成員。

防注入攻擊

在JSX中嵌入使用者輸入是安全的；

React DOM在渲染之前預設會過濾所有傳入的值。它可以確保應用程式不會被注入攻擊。所有的內容在渲染之前都被轉換成了字串。這樣可以有效地防止XSS(跨站腳本攻擊)

Babel轉譯器會把JSX轉換成一個名為React.createElement()的方法呼叫。

如果在普通的html裡面要寫jsx語法，要將script的type改成text/jsx，這是因為React獨有的JSX語法跟JavaScript不相容。凡是使用JSX的地方，都要加上type=「text/jsx」。其次，React提供兩個函式庫:react.js和JSXTransformer.js，它們必須先載入。其中，JSXTransformer.js的作用是將JSX語法轉為JavaScript語法。這一步很消耗時間，實際上線的時候，應該把它放到伺服器完成。

以上是react中JSX是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章！