Question

JSX代表什么？

我指的是被定义为ECMAScript的类似XML的语法扩展的JSX，它随着ReactJS的日益普及而变得非常流行。

Answer 1

JSX代表 J ava S cript X ML 。使用React，它是元素和组件的类似XML的代码的扩展。根据React docs和你提到的那样：

JSX是ECMAScript的类似XML的语法扩展，没有任何已定义的语义

从上面的引文中可以看出，JSX没有定义语义，它只是JavaScript的一个扩展，它允许编写类似XML的代码以简化和优雅，然后将JSX转换为纯JavaScript函数调用与React.createElement。根据React教程：

JSX是一个预处理器步骤，它为JavaScript添加了XML语法。你绝对可以在没有JSX的情况下使用React，但JSX使React更加优雅。

就像XML一样，JSX标签有标签名称，属性和子标签。如果属性值包含在引号中，则该值为字符串。否则，将值包装在大括号中，值是随附的JavaScript表达式。

JSX中的任何代码都转换为纯JavaScript / ECMAScript。考虑一个名为Login的组件。现在我们用JSX渲染它：

<Login foo={...} bar={...} />

如您所见，JSX只允许您为标记提供类似XML的语法，表示React中的组件和元素。它被转化为纯JavaScript：

React.createElement(Login, { foo: ..., bar: ... });

您可以阅读更多at the docs。

Answer 2

JSXJavaScript代表语法扩展。它类似于XML。您可以在React中使用简单的JSX语法转换。

Answer 3

JSX - JavaScript语法扩展一个预处理器步骤，它将XML语法添加到JavaScript

Answer 4

JSX代表具有类似语法的XML的Java

 eg.
<div>
</div>
or <td>
</td>

类似于XML格式，将其以返回格式放在类定义中

Answer 5

JSX 代表 JavaScript XML（eXtensible Markup L语言）。

JSX 是 JavaScript 中语法糖的例子之一。

语法糖是编程语言中的语法，旨在使事情更易于阅读或表达。

使用JSX编写的组件：

-------------------------------------------                                     
Time: 2021-05-08 18:50:48
-------------------------------------------
('Nahoj Morts', 15)
('KISSMEMYFAN1106♡', 91307)
('om_mhamd99', 903)
('?', 100)

如果我们不想使用JXS，那么上面代码片段的相应代码将如下所示。

const MyComponent = () => { 
  return <div> 
    <p>This is not HTML...!</p> 
    <p>Wait...Is this JavaScript?</p> 
    <p>No, What the hell is this?</p> 
    <p>This is JSX.</p> 
  </div> 
}

阅读更多：

Syntactic sugar - Wikipedia

Introducing JSX – React

JSX代表什么？

5 个答案: