前端面试题--react与vue的区别

前端面试题–react与vue的区别

首先从架构层面来看,vue是MVVM架构,是一个灵活易用的渐进式双向绑定,而react并没有准确的架构模式,react准确的架构模式是调和器和渲染器,它有的是属性和状态。用属性和状态去映射视图,react,强调的是属性不可变性,单向数据流。内部的状态内部自己控制。这样的设计可能从设计上更复杂一些,但是从使用上变得更确定,更清晰了。你甚至可以理解,react 就是一个 dom 拼接工具,把数据拼成新 dom 替换旧 dom 。当然,它性能很高,会尽可能复用 dom 来提高性能。

二者的核心思想不同:Vue : 以数据响应式为核心的UI框架,它的核心思想就是把所有的数据放在一个对象里面,然后当你操作对象时,对象就会改变数据,然后监听这个改变去改变UI。
React : 用一个函数来表示一个组件,当你把数据放进去时,它就会把数据渲染到组件里面,同时,在放数据的时候,要做到 “ 不可变 ”,也就是说,更新数据时,不是改变之前的数据,而是新生成一个和之前不一样的数据并放入函数,函数会得到一个新的UI,最后更新DOM树。
简单的来说:VUE是操作对象,而react是链接对象。

二者在组件写法上不同:
Vue的组件写法是通过template的单文件组件格式。
React的组件写法是JSX+inline style,也就是吧HTML和CSS全部写进JavaScript中。
二者的diff算法不同:
VUE:简单来说,就是vue的diff算法在对新老虚拟daom进行对比时,是从节点的两侧向中间对比;如果节点的key值与元素类型相同,属性值不同,就会认为是不同节点,就会删除重建
React:react的diff算法在对新老虚拟dom进行对比是,是从节点左侧开始对比,就好比将新老虚拟dom放入两个栈中,一对多依次对比;如果节点的key值与元素类型相同,属性值不同,react会认为是同类型节点,只是修改节点属性。

React框架架构也可以从五大方向解读
1,数据流思想=>单向数据流
2,编程思想=>函数式
3,diff算法=>计算碎片化,增量diff
4,Vdom结构=>双向链表
5,事务思想=>调度算法

你可能感兴趣的:(vue,前端,vue.js,react.js)