说说你对自定义hooks的理解
通过自定义hooks,可以将组件逻辑提取到可重用的函数中。
可以理解为hooks就是用来放一些重复代码的函数。
通过闭包的方式给return出来,这是非常高级的方式
说说你对useMemo的理解
useMemo接收两个参数,分别是函数和一个数组(实际上是依赖项),函数里面return函数,数组内存放依赖
使用memo可以帮助我们优化性能,让react没必要执行不必要的函数
说说对useContext的理解
context 它可以将全局的数据通过provider接口传递value给到局部的的组件,让包裹在provider中的局部组件可以获取到全局数据的读写接口
import React, { createContext, useContext, useState } from \"react\";
const initialState = { m: 100, n: 50 }; // 定义初始state
const X = createContext(); // 创建Context
let a = 0;
export default function App() {
console.log(`render了${a}次`);//用来检查执行App函数多少次
const [state, setState] = useState(initialState); // 创建state读写接口
a += 1;
return (
<X.Provider value={{ state, setState }}> // 通过provider提供value给包围里内部组件,只有包围里的组件才有效
<Father></Father>
</X.Provider>
);
}
const Father = (props) => {
const { state, setState } = useContext(X);//拿到 名字为X的上下文的value,用两个变量来接收读写接口
const addN = () => {
setState((state) => {
return { ...state, n: state.n + 1 };
});
};
为什么不能在循环,条件或嵌套函数中调用Hooks?
react中,父子组件的声明周期执行顺序是怎么样的?
说说react事件和原生事件的执行顺序?
react的所有事件都是挂载在document 中,
当真实dom触发后冒泡到documnet后才会对react事件进行处理
所以原生事件会先执行
然后执行react合成事件
最后执行真正在document上挂载的事件
react 和vue有什么区别?
react 是 Facebook 创建的javaScript UI框架,React推广了虚拟DOM 并创造了jsx语法,让我们可以在js中书写html代码
vue是尤雨溪开发的,也是使用虚拟dom 但是vue使用的是模板系统而不是jsx语法,因其模板系统都是用的普通的html,所有应用的升级更方便,更容易
react 是函数思想 ,在react中是单向数据流,推崇结合immutable来实现数据不可以变
vue是响应式思想,也就是基于数据可变的,通过对每一个属性建立watcher来监听,当属性变化的时候,响应式的更新对应的虚拟dom
react 的性能优化是需要手动去做的
vue的性能优化是自动的
Redux 和Vuex 有什么区别,它们有什么共同的思想?
相同点:
- state共享数据
- 流程一致:定义全局state,触发,修改state
- 原理相似,通过全局注入store
不同点:
redux
1. 组件点击事件或者其他方法 发送 action
2. store 接收到 action 会把 oldState 和 action 发送给 reducers
3. reduers 匹配对应的 action 就会修改 对应的 state
4. state 改变 store 触发监听函数 去修改 component视图
5. 单向数据流管理组件的状态
vuex
定义了state,getter,mutation,action 四个对象
- store 全局的唯一的仓库
- state 对象 存放数据的地方 修改state Vue 响应式系统执行 更新数据 刷新组件视图
- action 动作 发送信号
- mutation 修改数据的地方
用户通过点击或者发送一个 action
action 接收这个信号 去通知 mutations
mutations 会立即去修改mutate管理这个数据状态state
state状态发生改变,vue会触发响应式视图系统 直接更新数据 刷新视图
全局的数据状态更新过程就结束了
你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation。这样使得我们可以方便地跟踪每一个状态的变化,从而让我们能够实现一些工具帮助我们更好地了解我们的应用
- # vuex 四个辅助函数 (mapState 辅助函数帮助我们生成计算属性,让你少按几次键)
- # mapState
- # mapMutations
- # mapActions
- # mapGetters
mobx 和 redux有什么区别?