React.render返回什么？组件实例或组件类？

Question

在this要点中，在此行React.render = (ReactElement, HTMLElement | SVGElement) => ReactComponent;

ReactComponent指的是什么？一个instance or a class？

询问原因：我正在尝试创建一个可视化React术语的概念图（如下所示）。

Answer 1

TL; DR React.render返回一个ReactComponent实例

正如您所写，React.render接受两个参数。理解它们的含义很重要。这一点令人困惑所以请耐心等待。

1）ReactElement - 是一个虚拟dom实例。有时，此实例映射到本机DOM元素（如“div”），有时它会映射到ReactComponent实例，例如MyComponent，它封装了其他ReactElements的树。你看到这里的递归？

ReactElement -> Tree<ReactComponent returns ReactElement -> Tree<ReactComponent returns ReactElement>> 

现在，让我们创建一个虚拟dom实例

const virtualElement = React.createElement('MyComponent');

2）第二个参数是一个本机DOM元素，用于将virtualElement呈现为。

基本上React.render所做的是翻译本机DOM元素中的virtualElement并将其插入到React.render函数中指定为第二个参数的本机DOM元素中。

因此，React.render返回一个ReactComponent实例（封装的ReactElement树的有状态表示）。

我认为你可能会对符号感到有些沮丧，但它很有道理。以Java为例来考虑它：

function Person getPerson() { 
  return new Person();
}

请参阅，函数的签名未指定PersonInstance作为返回值，而是Person。