Content
12 Lessons • 0 Quizzes • 0 Challenges
序言
- 1
欢迎来到本课程
- 2
课程概述
- 3
用户界面（UI）的发展历史
介绍函数组件
- 1
使用组件构建应用程序
- 2
介绍函数组件
- 3
编写函数组件
- 4
测验：初识函数组件
- 5
挑战：多阶段导航栏
- 6
解决方案：多级导航栏
- 7
总结
在函数中创建状态
- 1
在函数组件中创建状态
- 2
使值保持持久
- 3
支持多种状态
- 4
监听值的变化
- 5
在组件顶层执行任务（concept）
- 6
将状态应用于单页应用（SPA）
- 7
测验：在函数中创建状态
- 8
挑战：动态处理多个状态
- 9
解决方案：动态处理多个状态
- 10
总结
接入 React
- 1
创建一个良好的状态解决方案
- 2
在挂载时更新一个钩子
- 3
什么是钩子？
- 4
条件钩子问题
- 5
避免条件性钩子
- 6
测验：接入 React
- 7
挑战：动态导航菜单搜索栏
- 8
解决方案：动态导航菜单搜索栏
- 9
总结
使用 State 来启动组件
- 1
useState 钩子设计
- 2
useState 钩子指南
- 3
分发状态
- 4
React 中的 useState 钩子流程
- 5
useState 钩子示例
- 6
测验：使用 State 启动组件
- 7
挑战：测验应用程序
- 8
解决方案：测验应用程序
- 9
总结
使用 Effect 处理副作用
- 1
什么是副作用？
- 2
理解 useEffect 钩子的设计
- 3
创建效果
- 4
测试驱动 useEffect 钩子
- 5
useEffect 钩子示例
- 6
测验：使用 Effects 处理副作用
- 7
挑战：待办事项应用
- 8
解决方案：待办事项应用
- 9
总结
使用记忆化提升性能
- 1
性能下降
- 2
理解 useMemo 的设计
- 3
重用最后一次赋值
- 4
useMemo 钩子的测试与示例
- 5
搜索防抖
- 6
测验：使用记忆化提升性能
- 7
挑战：任务管理应用
- 8
解决方案：任务管理应用
- 9
总结
使用上下文来覆盖一个区域
- 1
什么是区域更新？
- 2
介绍 React Context
- 3
理解 useContext 设计
- 4
测试 useContext 钩子
- 5
主题模式选择示例
- 6
表格上下文示例
- 7
测验：使用上下文覆盖一个区域
- 8
挑战：购物车
- 9
解决方案：购物车
- 10
总结
使用 Ref 隐藏内容
- 1
访问 DOM 元素
- 2
理解 useRef 钩子的设计
- 3
测试 useRef 钩子
- 4
全局事件处理与交互式用户界面
- 5
避免内存泄漏
- 6
平衡全局信息与同步
- 7
查找当前值示例
- 8
测验：使用 Ref 隐藏内容
- 9
挑战：反馈表单
- 10
解决方案：反馈表单
- 11
摘要
使用自定义 Hook 来复用逻辑
- 1
回顾 React Hooks
- 2
在 React 中使用 useToggle 自定义 Hook 实现状态切换
- 3
使用 useWindow Hook 掌握窗口属性和事件
- 4
使用 useAsync Hook 管理异步状态
- 5
使用 useDebounced 钩子实现防抖以提升性能
- 6
使用 useClickOutside 钩子提升用户交互性
- 7
使用 useCurrent 钩子高效管理当前值
- 8
使用 useProxy Hook 处理状态代理
- 9
测验：使用自定义 Hook 重用逻辑
- 10
挑战：色彩调色板生成器
- 11
解决方案：色彩调色板生成器
- 12
总结
结论
- 1
总结
附录：探索 JavaScript 和 React
- 1
探索 React 的函数
- 2
使用 JavaScript ES6
- 3
ES6 JavaScript 的特性 1. 箭头函数（Arrow Functions） 提供更简洁的函数语法，自动绑定 this 上下文。 2. 模板字符串（Template Literals） 使用反引号（`）定义字符串，支持嵌入表达式和多行文本。 3. 解构赋值（Destructuring Assignment） 从数组或对象中提取数据并赋值给变量，语法更直观。 4. 默认参数（Default Parameters） 函数参数可设置默认值，提升代码灵活性。 5. 增强的对象字面量（Enhanced Object Literals） 支持属性简写、方法简写和计算属性名。 6. 类（Classes） 引入类语法，使面向对象编程更清晰易懂。 7. 模块化（Modules） 支持使用 import 和 export 实现模块化开发。 8. Promise 对象 提供更优雅的异步编程方式，避免回调地狱。 9. Symbol 类型 创建唯一的标识符，用于对象属性键，避免命名冲突。 10. Set 和 Map 数据结构 Set 存储唯一值，Map 存储键值对，提供更高效的集合操作。 11. Generator 函数 可暂停和恢复执行，用于生成序列或处理异步逻辑。 12. 扩展运算符（Spread Operator） 展开数组或对象，便于合并与复制。 13. Rest 参数（Rest Parameters） 将不定数量的参数收集为数组。 14. for...of 循环 遍历可迭代对象（如数组、Map、Set 等）。 15. 新增内置方法 如 Array.from、Array.of、String.includes、Number.isNaN 等。
- 4
采用 CSS-in-JS 方法
- 5
从 HTML 到 JSX
- 6
动态元素类型
- 7
总结
Certificate of Completion
Showcase your accomplishment by sharing your certificate of completion.
Course Author:Anonymous User