Rreact学习笔记一

React与Vue的对比分析

1. 开发者

react 是Facebook公司创建维护的，Vue是有国内尤雨溪大神创建的，在生态圈上，React更完善一些，但在近几年发展中，Vue生态圈也逐步变的更加完善，个人感觉在国内，Vue的开发者占比应该要高于React（个人看法）

2.框架

vue - 本质是 MVVM 框架，由 MVC 发展而来
React - 本质是前端组件化框架，不是一个完整的MVC框架，可以认为是MVC中的V（View）
使用两者来开发完整应用都需要使用路由，状态管理等插件来完成

3.模板语法

Vue 使用的是Template模板语法，类似常规HTML的模板。写起来很接近标准HTML元素，只是多了一些属性。
React 使用的JSX语法，可以这么说在React中 一切皆为js
在模板语法上如果适应了JSX语法，你会发现JSX开更舒服
在模板分离上个人感觉vue做的更好

4.数据驱动

其实两者都是单向数据流，有人说vue是双向数据流，但那只是语法糖，实际上还是单向数据流，子组件无法直接修改父组件传进来的参数；在Vue中通过数据劫持，重写数据的getter和setter，在数据发生变化的时候会自动响应。react采用的是不可变数据，vue修改数据的时候直接修改，react中需要使用setState方法来修改，状态管理中，Redux 使用的是不可变数据，而Vuex的数据是可变的。Redux每次都是用新的state替换旧的state，而Vuex是直接修改。
vue相比React来说更自动化一些。

5.虚拟DOM（Virtual DOM）

因为直接操作Dom，会很损耗性能，所以出现了一个虚拟dom的概念，Virtual DOM是一个映射真实DOM的JavaScript对象，如果需要改变任何元素的状态，那么是先在Virtual DOM上进行改变，而不是直接改变真实的DOM。当有变化产生时，一个新的Virtual DOM对象会被创建并计算新旧Virtual DOM之间的差别。之后这些差别会应用在真实的DOM上。
在对比新旧虚拟Dom的时候会采用Diff算法，在Diff算法的时候Vue和React有所区别
Vue在渲染过程中，会跟踪每一个组件的依赖关系，不需要重新渲染整个组件树。而对于React而言，每当应用的状态被改变时，全部子组件都会重新渲染。当然，这可以通过shouldComponentUpdate这个生命周期方法来进行控制，但Vue将此视为默认的优化。

5. 组件通信

都有Props，子组件与父组件通信，vue是通过事件，react是通过回调函数

6.生命周期

查看官方文档对比了解

Vue的话 文档清晰，学习成本低，很多配置项很灵活有些东西很自动化，不需要开发者操心
React 学习曲线会陡峭一些，社区更完善一些

大型项目的庞大带来的是代码优化以及性能优化，react提倡的更细粒度的封装，带来的组件的复用性提高。更高自由度的编写（几乎无api）可以为手动优化性能带来更大的便利性，所以更适合一些，当然Vue也不是说不能适用于大项目，主要是看各自的框架构架和性能优化做的怎么样。

最后

以上就是可爱背包为你收集整理的Rreact学习笔记一的全部内容，希望文章能够帮你解决Rreact学习笔记一所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。