它不会对 React Element Tree（“不可变对象”）进行更新。它将先前的树与当前的树进行比较，并对 DOM 进行必要的更新。

React Element Tree 是 DOM 的简化形式。这就像一个快照。React 拥有当前快照，当应用程序的状态发生变化时，它会创建一个反映 DOM 应该是什么样子的新状态。React 比较这两个快照并对 DOM 进行必要的更改，以便它反映新的快照。之后，旧的、过时的快照被丢弃，新的快照成为 DOM 的当前快照。

基本上，你有：

• 应用程序的状态
• 描述应用程序在给定状态下的外观（您编写的 React 代码）
• 快照（react元素树）
• 区分和更新机器（React 库）
• DOM

DOM 或外部世界（即服务器）产生改变状态的事件。根据描述为该状态创建一个新快照。比较新旧快照并将更改引入 DOM。这个过程一遍又一遍地重复。

您可以在这篇精彩的博客文章中查看和了解有关 React 元素的更多信息：https : //reactjs.org/blog/2015/12/18/react-components-elements-and-instances.html

React 组件在内部使用 createElement 构建：

React.createElement(type, props)

因此，当对其 props 应用任何更改时，值会更新，但不会更新其类型。

例如：

React.createElement('h1', 'Hello, world!')
// first param is type, and second is prop

这里 prop 没有改变，因此这个元素不会被更新。

该组件可以用 createElement 编写，如：

React.createElement('div',
   React.createElement('h1', 'Hello world!'),
   React.createElement(....),
   React.createElement(...)
)

因此，每当特定元素的任何props发生更改时，该元素只会更新。

为什么只更新 props，而不更新 type ie。元素？

这是因为 React 将它们存储在 ReactDOM 对象中，而不是 HTML DOM。并仔细分析需要更新的内容。ReactDOM 只是一个带有键值对的对象。

例如，React 初始化它的 dom 如下：

var ReactDOM = {}

现在，无论属性需要更新，都可以处理。

Object.defineProperties(ReactDOM, {
  type: { // creating immutable property
    value: 'h1',
    writable: false,
    configurable: false
  },
  props: {
    writable: true,
    value: 'MY PROPS'
  }
});
Object.seal(ReactDOM)

现在，props可以更改但不能更改type。

ReactDOM.props = 'will be updated'
ReactDOM.type = 'will not be updated'
console.log(ReactDOM.type) // 'h1'
console.log(ReactDOM.props) // 'will be updated'

我希望这说明 React 的元素是不可变的。