Javascript 为什么嵌套JSX需要大括号，即使它没有大括号也可以工作

如果我有这个密码

var myDiv = <div>
               <h1>Hello World</h1>
            </div>

var myDiv=
你好，世界

它的工作原理与此相同

 var myDiv = {<div>
                   <h1>Hello World</h1>
              </div>}

var myDiv={
你好，世界
}

那为什么我真的需要牙套呢

那为什么我真的需要牙套呢

如果没有，您的第一个代码段就可以了（除了结尾缺少的分号：-）。事实上，您的第二个示例无法编译

如果您指的是

（）

，而不是

{}

，那么您可能指的是。正如文档中所说，这纯粹是为了避免自动插入分号的危险。在像您的代码这样的作业中没有ASI危险，但在使用

return

时有：

// Works
return (
    <div>
        <h1>Hello World</h1>
    </div>
);

// Also works
return <div>
        <h1>Hello World</h1>
    </div>;

// Also works
const div =
    <div>
        <h1>Hello World</h1>
    </div>;
return div;

// FAILS
return
    <div>
        <h1>Hello World</h1>
    </div>;

//有效
返回(
你好，世界
);
//也有效
返回
你好，世界
;
//也有效
警察司=
你好，世界
;
返回div；
//失败
返回
你好，世界
;

---

最后一个失败是因为ASI在

返回

之后和JSX之前插入了分号，使您的函数不返回任何内容。

我希望JSX文档中提到的“您应该始终使用括号以避免ASI出现问题”实际上已经解释过了，正如您所做的那样，而不是假设每个人都想用不必要的语法垃圾邮件发送他们的源代码。非常感谢。