Merge pull request #90 from LienJack/main

feat: 添加react hook

README.md

@@ -35,71 +35,73 @@
 
 ## 📖 目录
 
-- [🔥 这是什么？](#-这是什么)
+- [Fucking Frontend](#fucking-frontend)
-- [💻 如何使用](#-如何使用)
+  - [🔥 这是什么？](#-这是什么)
-- [如何获取本仓库资料](#如何获取本仓库资料)
+  - [💻 如何使用](#-如何使用)
-- [📖 目录](#-目录)
+  - [如何获取本仓库资料](#如何获取本仓库资料)
-- [如何高效自学](#如何高效自学)
+  - [📖 目录](#-目录)
-- [书籍推荐](#书籍推荐)
+  - [如何高效自学](#如何高效自学)
-  - [初级](#初级)
+  - [书籍推荐](#书籍推荐)
-  - [进阶](#进阶)
+    - [初级](#初级)
-  - [高级](#高级)
+    - [进阶](#进阶)
-- [前端核心学习路径](#前端核心学习路径)
+    - [高级](#高级)
-  - [前端核心三板斧](#前端核心三板斧)
+  - [前端核心学习路径](#前端核心学习路径)
-  - [JS](#js)
+    - [前端核心三板斧](#前端核心三板斧)
-    - [数据类型](#数据类型)
+    - [JS](#js)
-    - [类型判断](#类型判断)
+      - [数据类型](#数据类型)
-    - [类型转换](#类型转换)
+      - [类型判断](#类型判断)
-    - [this](#this)
+      - [类型转换](#类型转换)
-    - [闭包](#闭包)
+      - [this](#this)
-    - [变量提升](#变量提升)
+      - [闭包](#闭包)
-    - [作用域](#作用域)
+      - [作用域](#作用域)
-    - [原型](#原型)
+      - [原型](#原型)
-    - [new](#new)
+      - [new](#new)
-    - [Class(类)](#class类)
+      - [变量提升](#变量提升)
-    - [继承](#继承)
+      - [Class(类)](#class类)
-    - [模块化](#模块化)
+      - [继承](#继承)
-    - [事件循环](#事件循环)
+      - [模块化](#模块化)
-    - [Promise](#promise)
+      - [事件循环](#事件循环)
-    - [迭代器与生成器](#迭代器与生成器)
+      - [Promise](#promise)
-    - [节流与防抖](#节流与防抖)
+      - [迭代器与生成器](#迭代器与生成器)
-    - [柯里化（Currying）](#柯里化currying)
+      - [节流与防抖](#节流与防抖)
-    - [垃圾回收](#垃圾回收)
+      - [柯里化（Currying）](#柯里化currying)
-    - [其他零散但重要的知识点](#其他零散但重要的知识点)
+      - [垃圾回收](#垃圾回收)
-  - [HTML](#html)
+      - [其他零散但重要的知识点](#其他零散但重要的知识点)
-    - [HTML 语义化](#html-语义化)
+    - [HTML](#html)
-  - [CSS](#css)
+      - [HTML 语义化](#html-语义化)
-    - [CSS 盒子模型](#css-盒子模型)
+    - [CSS](#css)
-    - [CSS 选择器](#css-选择器)
+      - [CSS 盒子模型](#css-盒子模型)
-    - [Flex](#flex)
+      - [CSS 选择器](#css-选择器)
-    - [grid](#grid)
+      - [Flex](#flex)
-    - [其他](#其他)
+      - [grid](#grid)
-- [浏览器](#浏览器)
+      - [其他](#其他)
-- [性能优化](#性能优化)
+  - [浏览器](#浏览器)
-- [框架](#框架)
+  - [性能优化](#性能优化)
-  - [虚拟 DOM](#虚拟-dom)
+  - [框架](#框架)
-- [React](#react)
+    - [虚拟 DOM](#虚拟-dom)
-  - [合成事件](#合成事件)
+  - [React](#react)
-  - [如何编写一个组件](#如何编写一个组件)
+    - [合成事件](#合成事件)
-  - [受控组件和非受控组件](#受控组件和非受控组件)
+    - [如何编写一个组件](#如何编写一个组件)
-  - [高阶组件（HOC）](#高阶组件hoc)
+    - [受控组件和非受控组件](#受控组件和非受控组件)
-  - [原理](#原理)
+    - [高阶组件（HOC）](#高阶组件hoc)
-- [Vue](#vue)
+    - [React Hooks](#react-hooks)
-- [TypeScript](#typescript)
+    - [原理](#原理)
-- [Electron](#electron)
+  - [Vue](#vue)
-- [组件库](#组件库)
+  - [TypeScript](#typescript)
-- [微前端](#微前端)
+  - [Electron](#electron)
-- [跨端框架](#跨端框架)
+  - [组件库](#组件库)
-- [监控](#监控)
+  - [微前端](#微前端)
-- [面试](#面试)
+  - [跨端框架](#跨端框架)
-- [日常充电](#日常充电)
+  - [监控](#监控)
-  - [CSS](#css-1)
+  - [面试](#面试)
-- [Github 优秀学习资料](#github-优秀学习资料)
+  - [日常充电](#日常充电)
-  - [JS](#js-1)
+    - [CSS](#css-1)
-  - [代码样式及安全](#代码样式及安全)
+  - [Github 优秀学习资料](#github-优秀学习资料)
-- [生产力工具](#生产力工具)
+    - [JS](#js-1)
-  - [流程图](#流程图)
+    - [代码样式及安全](#代码样式及安全)
-- [作者信息](#作者信息)
+  - [生产力工具](#生产力工具)
+    - [流程图](#流程图)
+  - [作者信息](#作者信息)
 
 ## 如何高效自学
 
@@ -503,12 +505,22 @@ Virtual DOM 也就是虚拟节点。通过 JS 的 Object 对象模拟 DOM 中的
   - [ ] [hoc 库 recompose](https://github.com/acdlite/recompose)
   - [ ] [精读 React 高阶组件](https://zhuanlan.zhihu.com/p/27434557)
 
+
+### React Hooks
+Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。
+- [ ] 文档
+  - [ ] [React Hooks 官方文档](https://zh-hans.reactjs.org/docs/hooks-intro.html)
+- [ ] 推荐文章
+  - [ ] [彻底理解 React hook useCallback和useMemo的区别](https://juejin.cn/post/6844904032113278990)
+  - [ ] [React hooks 最佳实践](https://mp.weixin.qq.com/s/0sykIHDM_Ih3W3md-DwFkw)
+
 ### 原理
 
 - [react-source-code-debug](https://github.com/neroneroffy/react-source-code-debug)，学习如何调试源码
 - [react-illustration-series](https://github.com/7kms/react-illustration-series)，图解 react 源码，用大量配图的方式，致力于将 react 原理表述清楚
 - [just-react](https://github.com/BetaSu/just-react)，「React 技术揭秘」，一本自顶向下的 React 源码分析书
 - [tiny-react](https://github.com/PiNengShaoNian/tiny-react)，基于 React17 精简而来的最小版实现
+- [从Context源码实现谈React性能优化](https://juejin.cn/post/6907546624441090055)
 
 ## Vue