React
当我们使用React开发的时候，我们就是在写React组件，组件的state即数据，组件的render方法返回的是视图，组件的声明周期钩子和事件的处理，是数据的变化逻辑。更准确地说是一颗组件树，根组件引用子组件，子组件可能还会引用子组件，形成组件树。组件树的结构和视图的盒子嵌套结构类似。
将界面划分为组件、声明视图和数据的关系、实现数据的变化逻辑
JSX是一个JavaScript的语法扩展
生命周期：常见的生命周期钩子函数有componentDidMount、componentDidUpdate、componentwillUnmount
为什么需要hook？
为了让功能代码聚合在一起，增加了组件的可维护性。hook提供了功能逻辑代码复用的新方式。React需要提供一些额外的api实现，由于React推崇函数式组件的简洁和声明式编程的理念，hook给函数组件增加状态和逻辑。
useState和useEffect
usestate原理：让函数式组件拥有自己的状态，如何让函数式组件拥有自己的状态，有两个关键：1.状态存储在哪里？2.状态以什么格式存储
状态存储在哪里？对于class组件可以直接挂载实例上面，函数式组件应该挂在虚拟DOM节点上，渲染过程中，调用函数组件时候React是知道在处理哪个节点的，因此当在函数式组件中调用useState方法，React就可以把创建的状态挂到相应的节点上面。在下一次调用函数组件时候，React发现已经有这个状态了，就把值返回。
状态如何存储？类比class组件，把整个state作为一个对象存储，但是上面提到，这样存储不能达到分离功能逻辑的目的；因此我们希望可以将状态分开，每个状态有自己对应的key，例如const 【a,setA】= useState('a',’‘) 即对象存储状态，useState方法传递一个key和一个初始值，React把这个key和对应value存储到对象上。但是这样会比较冗余，React实现方式是只需要传递初始值，不用传递key，React根据useState调用顺序来识别是哪一个状态。函数式组件的状态就是一个数组格式，每个状态在函数式组件中调用useState声明的顺序，也是它们在状态数组中存储的顺序。
- 函数式组件添加状态需要useState这个hook；在函数式组件中添加一些有副作用的操作，需要用到useEffect这个hook
- useState函数接收一个参数作为初始值；
- useState返回值为一个数组，数组第一个元素式状态变量，第二个元素是设置该状态的方法；
- 调用设置状态的方法，会同步触发diff和更新操作
- useEffect接收第一个参数是一个回调callback，会在特定时机执行
- useEffect传入的callback，可以返回一个方法clearEffect，React会在组件卸载时候调用clearEffect，清除副作用
- useEffect第二个参数是一个数组，数组中是依赖项，当依赖变化时候才会执行useEffect传入的方法
- 如果是空数组，则只在组件挂载时候执行，类似compontDidMount
- 如果第二个参数不传，则在组件更新时候执行
Vue
vue是一款优秀的web应用开发框架，使用它让我们开发应用时更加高效。从用户角度，web应用要提供交互能力和信息展示。从开发者角度，web应用是一种利用网络浏览器和网络技术在互联网上执行任务和计算机程序。（前端开发者实现一个web应用需要用到创建和改变界面dom的能力来给用户呈现预期的界面、网络通信能力来控制和获取用户关心的数据）
比较
相同点：Virtual DOM、提供响应式和组件化的视图组件、将注意力集中在核心库，其他功能如路由和全局状态管理交给相关的库
不同点：
使用上：React的api简洁，Vue的Api更多，vue编写代码可能更少
Vue更容易上手，React要实现相同功能需要用户操作，Vue的模板语法更贴近原生，因此更容易接收和理解
模板语法和JSX 其实vue也支持JSX，JSX表达能力更强，模板语法更直观
超大规模的首屏渲染上React有一些优势，因为Vue需要做一些初始化工作
React组件是继承React.compont ,Vue是对象，因此React可以实现基于继承的组件复用，而Vue不行
原理上：Vue通过数据劫持，实现当数据变化时候响应式更新，React在setState时候diff组件树
标签：状态,Vue,函数,区别,React,useState,组件 From： https://www.cnblogs.com/baller-coder/p/16976726.html