react同步方法_React 之我见：JSX，虚拟 DOM，Diff 算法，setState，props 和state

本文主要梳理一下我对 React 框架基础内容的认识，之后也会总结一些深度内容的认识。当然，笔者水平也有限，如果你发现不妥之处，望斧正！

为什么要用 React 等前端框架

因为可以进行组件化开发？社区强大？使用的人多？有很多好用的第三方库和插件？适用于单页面应用开发？这些都不是最本质的原因。

最本质的原因是保持 UI 和状态同步并不容易。

使用原生 JavaScript 编写代码的时候，一般静态内容是在 HTML 中创建，动态内容使用 JavaScript 创建。但是使用 JavaScript 构建 UI 代码量巨大，并且可读性不高，代码可复用性也差。

更重要的是，如果我们想要保持 UI 和状态的同步应该怎么做？例如，我们有一个列表，我们需要实现将列表与服务器同步的功能。我们需要将本地数据和服务器发来的数据进行比较。并且需要点对点的将每个变更同步到 DOM 节点中。如果这个过程中有每一步出现差错都直接导致 UI 同步失败。因此，维护 UI 与数据同步需要编写大量繁琐，脆弱和脆弱的代码。

为了解决以上问题，降低开发成本，前端社区出现了 React 等框架。到目前为止，这些框架提供的最大的改进是实现应用状态和 UI 同步。我们只需要定义一次 UI，不必为每一次动作都编写 UI。相同的状态总能得到相同的 UI 输出，即状态和 UI 同步，状态变更后会自动更新 UI。

推荐阅读： https:// zhuanlan.zhihu.com/p/39 852035

React VS Vue

很多人都说 React 上手要难一些，Vue 上手要简单一些。也有很多人在问 React 和 Vue 的区别是什么。我想说一下我的理解。

首先，在框架设计层面，React 是 MVC 软件架构中的 View，它只负责视图层的东西，而对于数据和路由等，则由 Redux 和 Router 等来完成。这也就是为什么 React 官方文档说 “React 是一个用于构建用户界面的 JavaScript 库”。而 Vue 则不同，Vue 是基于 MVVM 架构设计的一个框架，所以在架构层面，Vue 和 React 的思想就是不同的。

React 的设计哲学很简单，不可变（Immutable）思想贯穿了整个框架的设计。React 可以说没引进什么新的概念，让开发者能够以类似写原生 JavaScript 代码的方式来使用 React 进行开发。这也就是很多人说 React 难的原因，即 JavaScript 基础知识。

而很多人说 Vue 容易上手，可能有些同学就迷惑了，我觉得 Vue 不简单啊。笔者认为，说 Vue 简单是因为 Vue 将很多底层逻辑封装好了，直接给你对应的 API，你调用对应 API 就可以完成对应的工作。所以，你不需要有很扎实的 JavaScript 基础，你只要记住或者能够查阅到对应 API 就可以用 Vue 完成一些基础性的开发。所以有些后端的同学可以看看 Vue 官方文档就能上手基础的前端开发。

React 之我见，那一定要说我的看法，我喜欢 React。我喜欢其简洁的设计理念和类原