一些概念

309 阅读2分钟

Element

Element 是我们用jsx语法写的组件被babel转译之后调用createElement 方法生成的对象。 这个对象描述了当前组件极其子组件的关系。是DOM树的js对象表示方法。

Element对象有一个属性 type描述的是组件的类型。根据这个类型的不同,会生成不同的挂载实例。

挂载实例

挂载实例是:组件在挂载的时候选用不同的构造函数来初始化不同的实例。

根据Element的不同一般分为三类:

纯文本: 就是纯文本选择 ReactDOMTextComponent 构造函数来初始化挂载实例。

原生元素: 采用ReactDOMComponent 构造函数来初始化挂载实例。

综合组件:就是自定义的组件,期内包含纯文本和综合组件。

广义上分为三种挂载实例。

挂载实例的作用是React用来辅助组件的挂载。实例内有mountComponent等方法。以及 _currentElement等的属性存储用到的信息。

组件实例

组件实例与组件挂载实例很相似,但是却是不同的东西。

组件实例只存在于 综合组件 的挂载实例内。

其作用是实例化一个组件。

比如我们定义的App组件,只有实例化之后才能发挥作用,而组件实例就是初始化一个组件实例。

组件挂载实例是以Element的不同来实例化不同的挂载实例。

而组件实例new 了一个 Element.type 的实例(Element.type是一个函数比如 App组件 的 f (props))。

组件实例里包含了我们写组件的时候定义的方法,一些生命周期方法 componentDidMount等,以及我们的自定义的事件方法,state属性等,而 组件的挂载实例是没有这些的

综合组件

综合组件简单的来说就是我们自定义的组件,这类组件可以包含类html标签的元素,或者是纯文本元素。这类组件的 Element.type是一个方法。

这类组件的挂载组件基于 ReactCompositeComponent 类。