javascript - Facebook React 教程 : JSX Compiler preventing pollution of global namespace?

Question

facebook React 教程有以下代码和附注:

// tutorial3.js
var CommentBox = React.createClass({
  render: function() {
    return (
      <div className="commentBox">
        <h1>Comments</h1>
        <CommentList />
        <CommentForm />
      </div>
    );
  }
});

Notice how we're mixing HTML tags and components we've built. HTML components are regular React components, just like the ones you define, with one difference. The JSX compiler will automatically rewrite HTML tags to React.createElement(tagName) expressions and leave everything else alone. This is to prevent the pollution of the global namespace.

我不确定我是否完全理解粗体部分，可能是因为我还不太熟悉 React 的内部工作原理。我的理解是 JSX 编译器将用 React.createElement() 替换 HTML 标签以及我自己的自定义组件标签，但我并没有完全看到使用 React.createElement() 如何防止全局命名空间污染之间的联系。否则“h1”会是一个全局变量还是什么？甚至不替换 HTML 标签怎么行——我认为 React 有它自己的内部 DOM，它通过 React.createElement() 跟踪它？

教程 here .

Answer 1

React.createClass 使用 CommentBox 等自定义类污染全局命名空间。但是，对于 HTML 组件，没有类定义，只有一个 React.createElement。