javascript - React 如何知道函数组件是否是 React 组件？

Question

React 支持类组件和函数组件。所有 React 文件的顶部都有一个 import React from ‘react’ 语句。创建类组件时(如下所示:class MyClassComponent extends React.Component ...)，会明确提及该类实例从哪个类扩展。但是，在声明函数组件 (const MyFunctionComponent = () => ()) 时，并没有明确表示“嘿，顺便说一句，这是一个 React 组件。”

据我们所知，这可能是纯 JavaScript 中的函数。那么，React 是如何将函数识别为函数组件的呢？

Answer 1

这是 isValidElement() 的代码功能。简而言之，他们检查它是否是一个对象(函数是对象)，其 $$typeof 为 REACT_ELEMENT_TYPE 符号。

除此之外，它是否是一个正常的函数并不重要。在大多数情况下，即使我做了一些随机函数，只要它有 render() 函数，它就可以用作 React 元素。我不确定他们是否检查了缺少的生命周期函数，但如果他们这样做了，那么它就会起作用(如果没有，它会抛出错误)。

当谈到 JavaScript 的“继承”时，它总是归结为对象的形状是否与预期的形状匹配。