讲讲什么是 JSX ？
JSX（JavaScript XML）是React的一种特性，它允许你使用类似XML/HTML的语法来编写JavaScript代码。虽然它的名字包含了“XML”，但实际上它并不是XML，而是JavaScript的一个语法扩展。以下是从React角度对JSX的详细解释：
-
声明式UI：JSX让开发者能够以声明式的方式来构建UI。这意味着你描述你想要的UI状态，而不是一步一步地告诉浏览器如何更新DOM。
-
更简洁的语法：在React中，使用JSX可以让你用更接近HTML的方式编写JavaScript代码。这使得React组件的模板非常直观，易于阅读和理解。
-
JSX在浏览器中不可直接识别：由于JSX不是JavaScript的一部分，浏览器不能直接解析它。在编译过程中，Babel会将JSX转换成标准的JavaScript代码。
-
组件的定义：在React中，组件是构建UI的基本单位。JSX允许你定义组件的结构，就像定义HTML元素一样。
-
嵌入JavaScript表达式：JSX允许你在JSX元素中直接嵌入JavaScript表达式。这些表达式用大括号
{}括起来。 -
属性和子元素：JSX元素可以有属性（比如
className，onClick等），也可以有子元素。属性必须用引号括起来（字符串）或者用大括号括起来（JavaScript表达式）。 -
组件属性：JSX中的组件属性可以是普通的值（如字符串、数字），也可以是复杂的值（如对象、函数）。
-
条件渲染和列表渲染：JSX支持条件渲染和列表渲染。你可以使用JavaScript的条件语句（如if-else）和循环语句（如map）来渲染元素。
-
可维护性和可读性：由于JSX结合了JavaScript和HTML，这使得React组件更加易于维护和阅读。
总之，JSX是React用来构建用户界面的一个核心特性，它提供了一种更加直观、灵活的方式来编写React组件，使得开发过程更加高效和愉快。