前言
如果你是一位有抱负的前端程序员并准备面试,那么这篇文章很适合你。本文是你学习和面试 React 所需知识的 *** 指南。
JavaScript 工具缓慢而稳定地在市场中扎根,对 React 的需求呈指数级增长。选择合适的技术来开发应用或网站变得越来越有挑战性。其中 React 被认为是增长最快的 Javascript 框架。
截至今天,Github 上约有 1,000 名贡献者。Virtual DOM 和可重用组件等独特功能吸引了前端开发人员的注意力。尽管它只是 MVC(模型 – 视图 – 控制器)中“视图”的库,但它对 Angular,Meteor,Vue 等全面的框架也构成了强力的挑战。下图为流行的 JS 框架的趋势:
JS 框架的趋势
React 面试题
以下是面试官最有可能问到的50 个 React 面试题和答案。为方便你学习,我对它们进行了分类:
· 基本知识
· React 组件
· React Redux
· React 路由
基本知识
1、区分 Real DOM 和 Virtual DOM
2、什么是 React?
· React 是 Facebook 在 2011 年开发的前端 JavaScript 库。
· 它遵循基于组件的方法,有助于构建可重用的 UI 组件。
· 它用于开发复杂和交互式的 Web 和移动 UI。
· 尽管它仅在 2015 年开源,但有一个很大的支持社区。
3、React 有什么特点?
React 的主要功能如下:
1. 它使用 虚拟 DOM而不是真正的 DOM。
2. 它可以进行 服务器端渲染。
3. 它遵循 单向数据流 或数据绑定。
4、列出 React 的一些主要优点。
React 的一些主要优点是:
1. 它提高了应用的性能
2. 可以方便地在客户端和服务器端使用
3. 由于 JSX,代码的可读性很好
4. React 很容易与 Meteor,Angular 等其他框架集成
5. 使用 React,编写 UI 测试用例变得非常容易
5、React 有哪些限制?
React 的限制如下:
1. React 只是一个库,而不是一个完整的框架
2. 它的库非常庞大,需要时间来理解
3. 新手程序员可能很难理解
4. 编码变得复杂,因为它使用内联模板和 JSX
6、什么是 JSX?
JSX 是 J avaScript XML 的简写。是 React 使用的一种文件,它利用 JavaScript 的表现力和类似 HTML 的模板语法。这使得 HTML 文件非常容易理解。此文件能使应用非常可靠,并能够提高其性能。下面是 JSX 的一个例子:
1. render(){
2. return(
3. <div>
4. <h1> Hello World from Edureka!!</h1>
5. </div>
6. );
7. }
7、你了解 Virtual DOM 吗?解释一下它的工作原理。
Virtual DOM 是一个轻量级的 JavaScript 对象,它最初只是 real DOM 的副本。它是一个节点树,它将元素、它们的属性和内容作为对象及其属性。React 的渲染函数从 React 组件中创建一个节点树。然后它响应数据模型中的变化来更新该树,该变化是由用户或系统完成的各种动作引起的。
Virtual DOM 工作过程有三个简单的步骤。
1. 每当底层数据发生改变时,整个 UI 都将在 Virtual DOM 描述中重新渲染。
2. 然后计算之前 DOM 表示与新表示的之间的差异。
3. 完成计算后,将只用实际更改的内容更新 real DOM。
基本知识
1、区分 Real DOM 和 Virtual DOM
2、什么是 React?
3、React 有什么特点?
4、列出 React 的一些主要优点。
5、React 有哪些限制?
6、什么是 JSX?
7、你了解 Virtual DOM 吗?解释一下它的工作原理。
8、为什么浏览器无法读取 JSX?
9、与 ES5 相比,React 的 ES6 语法有何不同?
10、React 与 Angular 有何不同?
React 组件
11、你怎样理解“在 React 中,一切都是组件”这句话。
12、怎样解释 React 中 render() 的目的。
13、如何将两个或多个组件嵌入到一个组件中?
14、什么是 Props?
15、React 中的状态是什么?它是如何使用的?
16、区分状态和 props。
17、如何更新组件的状态?
18、React 中的箭头函数是什么?怎么用?
19、区分有状态和无状态组件。
20、React 组件生命周期的阶段是什么?
21、详细解释 React 组件的生命周期方法。
22、React 中的事件是什么?
23、如何在 React 中创建一个事件?
24、React 中的合成事件是什么?
25、你对 React 的 refs 有什么了解?
26、列出一些应该使用 Refs 的情况。
27、如何模块化 React 中的代码?
28、如何在 React 中创建表单
29、你对受控组件和非受控组件了解多少?
30、什么是高阶组件(HOC)?
31、你能用 HOC 做什么?
32、什么是纯组件?
33、React 中 key 的重要性是什么?
React Redux
34、3MVC 框架的主要问题是什么?
35、解释一下 Flux
36、什么是 Redux?
37、Redux 遵循的三个原则是什么?
38、你对“单一事实来源”有什么理解?
39、列出 Redux 的组件。
40、数据如何通过 Redux 流动?
41、如何在 Redux 中定义 Action?
42、解释 Reducer 的作用。
43、Store 在 Redux 中的意义是什么?
44、Redux 与 Flux 有何不同?
45、Redux 有哪些优点?
React 路由
46、什么是 React 路由?
47、为什么 React Router v4 中使用 switch 关键字?
48、为什么需要 React 中的路由?
49、列出 React Router 的优点。
50、React Router 与常规路由有何不同?
因文章篇幅过长,题目和答案已整理为 PDF 文档,如下图:
想要获取这个面试题可以关注我的主页