前端相关

258 阅读1分钟
  • react:React框架的核心;
  • react-dom:React视图渲染的核心[基于React构建WebApp(HTML页面)。

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

setState更新是同步还是异步?

如果是是正常情况下,也就是在没有使用Concurrent组件的情况下,是同步更新的,但是不会立即获取到最新state的值,因为调用setState至少单纯的将你传进来的新的state放入updateQueue这条链表上,等这个点击事件结束之后会触发内部的一个回调函数,在这个回调函数中才会真正的更新state以及重新渲染;当使用了Concurrent组件的时候这种情况下才是真正的异步更新模式,同样的没法立即获取最新状态,并且在执行react的更新和渲染的过程中使用了真正的异步方式(postMessage)这个时真正的异步,当使用了flushSync这个API的时候react的更新渲染完全是同步会立即执行更新state以及渲染的过程,这种情况可以获取到最新的状态。

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

LRU是Least recently used的简写,主要原理是根据历史访问记录来淘汰数据,说白了就是这个算法认为如果数据被访问过,那么将来被访问的几率也高。其存储结构是一个双链表,最近被访问到的放在双链表的尾部,头部放的就是最早被访问到数据。

image.png

image.png

image.png

image.png

image.png 路由勾子的实现:建立个路由队列,多个钩子跳转的时候可以解析后拼接在一起去迭代依次执行 路由权限的实现(钩子 + addRoutes动态添加路由页面 + 封装指令注册到全局) router(里面放的路由对象里面的方法)router(里面放的路由对象里面的方法)route(属性 = this.current)

image.png