react是什么？

Posted 2020-10-04 徐可可

react是facebook开发的一款js库，那么facebook创建react的初衷是为了解决什么问题呢？

facebook认为MVC无法满足他们的扩展需求？

由于他们巨大的代码库和庞大的组织，使得MVC很快变得非常复杂，每当需要添加一一项新的功能或特性时，系统的复杂度就成级数增长，致使代码变得脆弱和不可预测，结果导致他们的MVC正在土崩瓦解。

认为MVC不适合大规模应用？

当系统中有很多的模型和视图时，其复杂的程度就会迅速扩大，非常难以理解和调试，特别是模型和视图间可能存在的双向数据流动。

如何解决？

需要“以某种方式组织代码，使其更加可预测”，这通过他们facebook提出的flux和react已经完成。

　　flux是一个系统架构，用于推进应用中的数据单项流动。react是一个javascript框架，用于构建“可预期的”和“声明式的”web用户界面，它已经使facebook更快的开发web应用。

react用于构建那些随时间改变的大型应用，做这些，react有两个主要的特点？

1.简单

　　简单的表达任意“时间点”你的应用应该是什么样子的，react将会自动的管理ui界面更新当数据发生变化的时候。

2.声明式

　　在数据发生变化的时候，react从概念上讲与点击了f5一样，实际上他仅仅是更新了变化的一部分而已。

另外，why did we build react?

3.①react不是一个MVC框架

      react不使用模板

　　响应式更新非常简单

　　html5仅仅是个开始

*react主要的原理？

virtual DOM 虚拟DOM

传统的web应用，操作Dom一般是直接更新操作的，但是我们知道DOM更新是比较昂贵的。react为减少对Dom的操作，提供了一种不同的而又强大的方式来更新DOM操作。就是virtual DOM,一个轻量级的虚拟的DOM,就是react抽象出来的一个对象，描述dom应该是什么样子的，应该是什么样子的，应该如何呈现。通过这个virtual Dom去更新真实的DOM,由这个Virtual DOM管理真实DOM的更新。

为什么通过这多一层的virtual DOM操作就能更快？

因为react有个diff算法，更新virtual DOM并不保证马上影响真实的Dom,react会等到事件循环结束，然后利用这个diff算法，通过当前的dom表述与之前的作比较，计算出最小的步骤更新真是的Dom.

 

Components 组件

在DOM树上的节点被称为元素，在这里则不同，Virtual DOM上成为commponnent。

Virtual Dom的节点就是一个完整的抽象组件，它是由components的存在让计算DOM diff更高效。

state和render

State 和 Render
React是如何呈现真实的DOM，如何渲染组件，什么时候渲染，怎么同步更新的，这就需要简单了解下State和Render了。state属性包含定义组件所需要的一些数据，当数据发生变化时，将会调用Render重现渲染，这里只能通过提供的setState方法更新数据。

作者：RK_CODER
链接：http://www.jianshu.com/p/ae482813b791
來源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。