本文版权归 “公众号 | 前端一万小时” 所有，欢迎转载！
转载请注明出处，未经同意，不可修改文章内容。
🔥🔥🔥“前端一万小时”两大明星专栏限时折扣中，欢迎点击公众号菜单栏各模块了解~
❗️❗️❗️
以下链接为本文最新勘误篇章——《面试 | React》
-
“前端面试题”及“参考答案详解”属于 “￥102.4
￥199| 面试刷题” 私有团队专享内容，需付费阅读； -
文章列表所列示的文章属于 “￥2020
￥2999| 从零基础到轻松就业” 私有团队专享内容，除开源的部分，其它皆需付费阅读；
▷ 🚀HTML+CSS 实战：PC 端“简书”静态首页开发（难度：☆☆）
▷ 🚀原生 JS 项目实战：移动端音乐播放器（难度：☆☆☆）
▷ 🚀Vue.js 项目实战： 移动端“旅游网站”开发（难度：☆☆☆☆）
▽ React.js 基础语法学习
- 《React 初识——① React 简介和“环境搭建”》[编号：react_01]
❗❗️❗️️P.s. 公众号对话框回复 react_01、 vue_01、vue_02、web_01、html_01 或 css_01 查看参考答案样本~
涉及面试题：
1. 什么是 React？
2. React 的主要特点是什么？
3. React 的优点是什么？
4. React 的局限性是什么？
5. 什么是 CRA 及其好处？
6. React 和 Angular 有什么不同？
7. 与 Vue.js 相比，React 有哪些优势？
- 《React 初识——② React 工程目录文件简介》
- 《React 初识——③ React 中的组件和 JSX 初识》[编号：react_03]
涉及面试题：
1. 什么是 JSX？
2. 元素和组件有什么区别？
3. 如何在 React 中创建组件？
4. 何时使用类组件和函数组件？
5. createElement 和 cloneElement 有什么区别？
6. 怎样在 React 中写注释？
7. 如何使用 React 和 ES6 导入和导出组件？
- 《React 入门——① 编写 TodoList 雏形》[编号：react_04]
涉及面试题：
1. 什么是 Fragments？
2. 为什么使用 Fragments 比使用容器 div 更好？
3. 推荐的组件命名方法是什么？
- 《React 入门——② 响应式设计思想和事件绑定》[编号：react_05]
涉及面试题：
1. HTML 和 React 事件处理有什么区别？
2. 如何在 JSX 回调中绑定方法或事件处理程序？
3. 如何将参数传递给事件处理程序或回调函数？
4. React 中的合成事件是什么？
5. 每次组件渲染时调用函数的常见错误是什么？
6. 为什么有组件名称要首字母大写？
7. 在 React 中事件有何不同？
8. constructor 和 getInitialState 有什么区别？
9. 在使用 ES6 类的 React 中 super() 和 super(props) 有什么区别？
10. 如何将参数传递给事件处理程序？
- 《React 入门——③ 实现 TodoList 新增、删除功能》[编号：react_06]
涉及面试题：
1. 在 JSX 中如何进行循环？
2. keys 是否需要全局唯一？
- 《React 入门——④ JSX 语法细节补充》[编号：react_07]
涉及面试题：
1. 什么是内联条件表达式？
2. 为什么 React 使用 className 而不是 class 属性？
3. 在 React 中如何使用 innerHTML？
4. 如何在 React 中使用样式？
5. 如何有条件地渲染组件？
6. 如何有条件地应用样式类？
7. 如何使用 React label 元素？
8. 如何合并多个内联的样式对象？
9. 如何用 React 漂亮地显示 JSON？
10. 模块化样式文件有什么好处？
11. 是否可以在没有 JSX 的情况下使用 React？
- 《React 入门——⑤ 拆分组件和组件间传值》
- 《React 入门——⑥ TodoList 代码优化》
- 《React 入门——⑦ 初学 React 带给我们的一些思考》[编号：react_10]
涉及面试题：
1. 声明式编程 vs 命令式编程？
2. 什么是函数式编程？
- 《React 进阶——① PropTypes 和 DefaultProps 讲解》[编号：react_11]
涉及面试题：
1. 静态类型检查推荐的方法是什么？
2. 什么是 PropTypes？
3. 什么是 React proptype 数组？
- 《React 进阶——② state 、props 与 render 函数的关系》[编号：react_12]
涉及面试题：
1. React 的状态是什么？
2. React 中的 props 是什么？
3. 状态和属性有什么区别？
4. 为什么不能直接更新状态？
5. 回调函数作为 setState() 参数的目的是什么？
6. 如果在构造函数中使用 setState() 会发生什么？
7. 构造函数使用带 props 参数的目的是什么？
8. 什么是调解？
9. 如何使用动态属性名设置 state？
10. 在 React 中如何校验 props 属性？
11. 如果在初始状态中使用 props 属性会发生什么？
12. 为什么在 DOM 元素上展开 props 需要小心？
13. 为什么需要将函数传递给 setState() 方法？
14. 如何在 attribute 引号中访问 props 属性？
15. setState() 和 replaceState() 方法之间有什么区别？
16. 更新状态中的对象有哪些可能的方法？
17. 为什么函数比对象更适合于 setState()？
18. 如何使用 setState 防止不必要的更新？
19. 什么时候组件的 props 属性默认为 true？
- 《React 进阶——③ 虚拟 DOM（上）：React 中的“虚拟 DOM”》[编号：react_13]
涉及面试题：
1. 什么是 Virtual DOM？
2. Virtual DOM 如何工作？
3. Shadow DOM 和 Virtual DOM 之间有什么区别？
4. 什么是 React Fiber，它的主要目标是什么？
- 《React 进阶——④ 虚拟 DOM（下）：“虚拟 DOM”中的 Diff 算法》[编号：react_14]
涉及面试题：
1. 什么是“key”属性，在元素数组中使用它们有什么好处？
2. 索引作为键的影响是什么？
3. 安全地使用索引作为键的条件是什么？
4. 如何更新状态以及不更新状态？
- 《React 进阶——⑤ React 中 ref 的使用》[编号：react_15]
涉及面试题：
1. refs 有什么用？
2. 如何创建 refs？
3. 什么是 forward refs？
4. callback refs 和 findDOMNode() 哪一个是首选选项？
5. 为什么 String Refs 被弃用？
6. 什么是受控组件？
7. 什么是非受控组件？
8. 如何在页面加载时聚焦一个输入元素？
9. 在 React 中如何以编程方式触发点击事件？
10. 什么时候需要使用 refs？
- 《React 进阶——⑥ React 生命周期函数（上）：弄懂所有“生命周期函数”》[编号：react_16]
涉及面试题：
1. 组件生命周期的不同阶段是什么？
2. React 生命周期方法有哪些？
3. 在 React v16 中的错误边界是什么？
4. 在 React v15 中如何处理错误边界？
5. 在 componentWillMount() 方法中使用 setState() 好吗？
6. 在 mounting 阶段生命周期方法的执行顺序是什么？
7. 在 React v16 中，哪些生命周期方法将被弃用？
8. 生命周期方法 getDerivedStateFromProps() 的目的是什么？
9. 生命周期方法 getSnapshotBeforeUpdate() 的目的是什么？
10. 在组件类中方法的推荐顺序是什么？
11. 如何在调整浏览器大小时重新渲染视图？
12. 如何监听状态变化？
13. 如何每秒更新一个组件？
14. 为什么不能在 componentWillUnmount 中调用 setState() 方法？
15. 当组件重新渲染时顺序执行的方法有哪些？
- 《React 进阶——⑦ React 生命周期函数（中）：巧用 shouldComponentUpdate 提升组件性能》[编号：react_17]
涉及面试题：
如何提高性能？
- 《React 进阶——⑧ React 生命周期函数（下）：巧用 componentDidMount 进行 AJAX 数据请求》[编号：react_18]
涉及面试题：
如何在重新加载页面时保留数据？
- 《Redux 入门——① Redux 的概念和工作流程》[编号：react_19]
涉及面试题：
1. 什么是 Flux？
2. 什么是 Redux？
3. Redux 的核心原则是什么？？
4. 与 Flux 相比，Redux 的缺点是什么？
5. Flux 和 Redux 之间有什么区别？
- 《Redux 入门——② 使用 Antd 实现 TodoList 页面布局》
- 《Redux 入门——③ 创建 Redux 中的 store 并取得数据》[编号：react_21]
涉及面试题：
如何在组件外部访问 Redux 存储的对象？
- 《Redux 入门——④ Action 和 Reducer 的编写》[编号：react_22]
涉及面试题：
1. 我可以在 reducer 中触发一个 Action 吗？
2. 如何在加载时触发 Action？
3. 为什么 Redux 状态函数称为 reducers？
4. Redux DevTools 的功能有哪些？
- 《Redux 入门——⑤ actionTypes 的拆分》[编号：react_23]
涉及面试题：
1. 在 React 中如何定义常量？
2. Redux 中常量的用途是什么？
- 《Redux 入门——⑥ 使用 actionCreator 统一创建 action》
- 《Redux 进阶——① UI 组件、容器组件和无状态组件》[编号：react_25]
涉及面试题：
1. 什么是无状态组件？
2. 什么是有状态组件？
3. React Redux 中展示组件和容器组件之间的区别是什么？
4. 组件和不同类型？
- 《Redux 进阶——② Redux 中发送异步请求获取数据》[编号：react_26]
涉及面试题：
如何发起 AJAX 调用以及应该在哪些组件生命周期方法中进行 AJAX 调用？
- 《Redux 进阶——③ Redux 中间件（上）：初识 Redux 中间件》
- 《Redux 进阶——④ Redux 中间件（中）：使用 Redux-thunk 中间件实现 AJAX 数据请求》[编号：react_28]
涉及面试题：
1. 如何在 Redux 中发起 AJAX 请求？
2. 什么是 Redux-thunk？
- 《Redux 进阶——⑤ Redux 中间件（下）：使用 Redux-saga 中间件实现 AJAX 数据请求》[编号：react_29]
涉及面试题：
1. 什么是 Redux-saga？
2. Redux-saga 的模型概念是什么？
3. 在 Redux-saga 中 call() 和 put() 之间有什么区别？
4. Redux-saga 和 Redux-thunk 之间有什么区别？
- 《Redux 进阶——⑥ React-redux 重写 TodoList》
- 《React 拓展——① React 中使用 CSS3 过渡和动画》
- 《React 拓展——② 使用 react-transition-group 实现动画》
▽ 🚀React.js 项目实战：PC 端“简书”开发（难度：☆☆☆☆）
- 《Header 组件开发——① “项目初建”和“styled-components 初识”》
- 《Header 组件开发——② iconfont 在 React 实战中的应用》
- 《Header 组件开发——③ Header 组件布局》
- 《Header 组件开发——④ 换页旋转动画效果实现》
- 《Header 组件开发——⑤ React-redux 搭建标准的项目架子》
- 《Header 组件开发——⑥ Immutable.js 和 redux-immutable 助力数据管理》
- 《Header 组件开发——⑦ AJAX 获取推荐数据》
- 《Header 组件开发——⑧ 热门搜索“换一换”功能实现》
- 《首页开发——① 如何在 React 中使用“路由”》
- 《首页开发——② 首页布局》
- 《首页开发——③ 使用 React-redux 管理首页数据》
- 《首页开发——④ AJAX 获取首页数据》
- 《首页开发——⑤ “加载更多”功能实现》
- 《首页开发——⑥ “返回顶部”功能实现》
- 《详情页开发——① “布局”和“数据管理”》
- 《详情页开发——② 动态路由（页面路由参数的传递）》
- 《登录页开发——① 登录页面布局》
- 《登录页开发——② “登录”功能实现》
- 《写文章页开发——简易布局和“登录鉴权”》
- 《性能优化和项目上线——PureComponent、异步组件、withRouter 方法》
