网站设计 英文,工程造价信息网官网查询,网站建设需要入无形资产吗,信息流优化师是做什么的1、响应式原理不同 vue#xff1a;vue会遍历data数据对象#xff0c;使用Object.definedProperty()将每个属性都转换为getter和setter#xff0c;每个Vue组件实例都有一个对应的watcher实例#xff0c;在组件初次渲染的时候会记录组件用到了那些数据#xff0c;当数据发生…1、响应式原理不同 vuevue会遍历data数据对象使用Object.definedProperty()将每个属性都转换为getter和setter每个Vue组件实例都有一个对应的watcher实例在组件初次渲染的时候会记录组件用到了那些数据当数据发生改变的时候会触发setter方法并通知所有依赖这个数据的watcher实例调用update方法去触发组件的compile渲染方法进行渲染数据。
reactReact主要是通过setState()方法来更新状态状态更新之后组件也会重新渲染。
2、监听数据变化的实现原理不同 vueVue通过 getter/setter以及一些函数的劫持能精确知道数据变化。
reactReact默认是通过比较引用的方式diff进行的如果不优化可能导致大量不必要的VDOM的重新渲染。为什么React不精确监听数据变化呢这是因为Vue和React设计理念上的区别Vue使用的是可变数据而React更强调数据的不可变两者没有好坏之分Vue更加简单而React构建大型应用的时候更加鲁棒。
3、组件写法不同 vueVue的组件写法是通过template的单文件组件格式。
reactReact的组件写法是JSXinline style也就是吧HTML和CSS全部写进JavaScript中。
4、Diff算法不同 vue和react的diff算法都是进行同层次的比较主要有以下两点不同
vue对比节点如果节点元素类型相同但是className不同认为是不同类型的元素会进行删除重建但是react则会认为是同类型的节点只会修改节点属性。 vue的列表比对采用的是首尾指针法而react采用的是从左到右依次比对的方式当一个集合只是把最后一个节点移动到了第一个react会把前面的节点依次移动而vue只会把最后一个节点移动到最后一个从这点上来说vue的对比方式更加高效。 5、核心思想不同 vueVue的核心思想是尽可能的降低前端开发的门槛是一个灵活易用的渐进式双向绑定的MVVM框架。
reactReact的核心思想是声明式渲染和组件化、单向数据流React既不属于MVC也不属于MVVM架构。
6、数据流不同 vueVue1.0中可以实现两种双向绑定父子组件之间props可以双向绑定组件与DOM之间可以通过v-model双向绑定。Vue2.x中去掉了第一种也就是父子组件之间不能双向绑定了但是提供了一个语法糖自动帮你通过事件的方式修改并且Vue2.x已经不鼓励组件对自己的 props进行任何修改了。
reactReact一直不支持双向绑定提倡的是单向数据流称之为onChange/setState()模式。不过由于我们一般都会用Vuex以及Redux等单向数据流的状态管理框架因此很多时候我们感受不到这一点的区别了。
7、组合不同功能的方式不同 vueVue组合不同功能的方式是通过mixinVue中组件是一个被包装的函数并不简单的就是我们定义组件的时候传入的对象或者函数。比如我们定义的模板怎么被编译的比如声明的props怎么接收到的这些都是vue创建组件实例的时候隐式干的事。由于vue默默帮我们做了这么多事所以我们自己如果直接把组件的声明包装一下返回一个HoC那么这个被包装的组件就无法正常工作了。
reactReact组合不同功能的方式是通过HoC(高阶组件。React最早也是使用mixins的不过后来他们觉得这种方式对组件侵入太强会导致很多问题就弃用了mixinx转而使用HoC。高阶组件本质就是高阶函数React的组件是一个纯粹的函数所以高阶函数对React来说非常简单。
8、组件通信方法不同 vueVue中有三种方式可以实现组件通信父组件通过props向子组件传递数据或者回调虽然可以传递回调但是我们一般只传数据子组件通过事件向父组件发送消息通过V2.2.0中新增的provide/inject来实现父组件向子组件注入数据可以跨越多个层级。
reactReact中也有对应的三种方式父组件通过props可以向子组件传递数据或者回调可以通过 context 进行跨层级的通信这其实和 provide/inject 起到的作用差不多。React 本身并不支持自定义事件而Vue中子组件向父组件传递消息有两种方式事件和回调函数但Vue更倾向于使用事件。在React中我们都是使用回调函数的这可能是他们二者最大的区别。
9、模板渲染方式不同 vueVue是在和组件JS代码分离的单独的模板中通过指令来实现的比如条件语句就需要 v-if 来实现对这一点这样的做法显得有些独特会把HTML弄得很乱。
reactReact是在组件JS代码中通过原生JS实现模板中的常见语法比如插值条件循环等都是通过JS语法实现的更加纯粹更加原生。
10、渲染过程不同 vueVue可以更快地计算出Virtual DOM的差异这是由于它在渲染过程中会跟踪每一个组件的依赖关系不需要重新渲染整个组件树。
reactReact在应用的状态被改变时全部子组件都会重新渲染。通过shouldComponentUpdate这个生命周期方法可以进行控制但Vue将此视为默认的优化。
11、框架本质不同 vueVue本质是MVVM框架由MVC发展而来
reactReact是前端组件化框架由后端组件化发展而来。
参考自https://worktile.com/kb/ask/19606.html
