本项目的面试题来源于 sudheerj/reactjs-interview-questions 这个项目。一时兴起就动起了翻译的念头，由于本人的 React 功力尚浅，翻译的内容难免有误或不妥的地方，望请各位见谅。
目录
- 什么是 React？
- React 的主要特点是什么？
- 什么是 JSX？
- 元素和组件有什么区别？
- 如何在 React 中创建组件？
- 何时使用类组件和函数组件？
- 什么是 Pure Components？
- React 的状态是什么？
- React 中的 props 是什么？
- 状态和属性有什么区别？
- 我们为什么不能直接更新状态？
- 回调函数作为 setState() 参数的目的是什么？
- HTML 和 React 事件处理有什么区别？
- 如何在 JSX 回调中绑定方法或事件处理程序？
- 如何将参数传递给事件处理程序或回调函数？
- React 中的合成事件是什么？
- 什么是内联条件表达式？
- 什么是 "key" 属性，在元素数组中使用它们有什么好处？
- refs 有什么用？
- 如何创建 refs？
- 什么是 forward refs？
- callback refs 和 findDOMNode() 哪一个是首选选项？
- 为什么 String Refs 被弃用？
- 什么是 Virtual DOM？
- Virtual DOM 如何工作？
- Shadow DOM 和 Virtual DOM 之间有什么区别？
- 什么是 React Fiber？
- React Fiber 的主要目标是什么？
- 什么是受控组件？
- 什么是非受控组件？
- createElement 和 cloneElement 有什么区别？
- 在 React 中的提升状态是什么？
- 组件生命周期的不同阶段是什么？
- React 生命周期方法有哪些？
- 什么是高阶组件（HOC）？
- 如何为高阶组件创建属性代理？
- 什么是上下文（Context）？
- children 属性是什么？
- 怎样在 React 中写注释？
- 构造函数使用带 props 参数的目的是什么？
- 什么是调解？
- 如何使用动态属性名设置 state ？
- 每次组件渲染时调用函数的常见错误是什么？
- 为什么有组件名称要首字母大写？
- 为什么 React 使用 className 而不是 class 属性？
- 什么是 Fragments ？
- 为什么使用 Fragments 比使用容器 div 更好？
- 在 React 中什么是 Portal ？
- 什么是无状态组件？
- 什么是有状态组件？
- 在 React 中如何校验 props 属性？
- React 的优点是什么？
- React 的局限性是什么？
- 在 React v16 中的错误边界是什么？
- 在 React v15 中如何处理错误边界？
- 静态类型检查推荐的方法是什么？
- react-dom 包的用途是什么？
- react-dom 中 render 方法的目的是什么？
- ReactDOMServer 是什么？
- 在 React 中如何使用 innerHTML？
- 如何在 React 中使用样式？
- 在 React 中事件有何不同？
- 如果在构造函数中使用 setState() 会发生什么？
- 索引作为键的影响是什么？
- 在 componentWillMount() 方法中使用 setState() 好吗？
- 如果在初始状态中使用 props 属性会发生什么？
- 如何有条件地渲染组件？
- 为什么在 DOM 元素上展开 props 需要小心？
- 在 React 中如何使用装饰器？
- 如何 memoize（记忆）组件？
- 如何实现 Server Side Rendering 或 SSR？
- 如何在 React 中启用生产模式？
- 什么是 CRA 及其好处？
- 在 mounting 阶段生命周期方法的执行顺序是什么？
- 在 React v16 中，哪些生命周期方法将被弃用？
- 生命周期方法 getDerivedStateFromProps() 的目的是什么？
- 生命周期方法 getSnapshotBeforeUpdate() 的目的是什么？
- createElement() 和 cloneElement() 方法有什么区别？
- 推荐的组件命名方法是什么？
- 在组件类中方法的推荐顺序是什么？
- 什么是 switching 组件？
- 为什么我们需要将函数传递给 setState() 方法？
- 在 React 中什么是严格模式？
- React Mixins 是什么？
- 为什么 isMounted() 是一个反模式，而正确的解决方案是什么？
- React 中支持哪些指针事件？
- 为什么组件名称应该以大写字母开头？
- 在 React v16 中是否支持自定义 DOM 属性？
- constructor 和 getInitialState 有什么区别？
- 是否可以在不调用 setState 方法的情况下，强制组件重新渲染？
- 在使用 ES6 类的 React 中 super() 和 super(props) 有什么区别？
- 在 JSX 中如何进行循环？
- 如何在 attribute 引号中访问 props 属性？
- 什么是 React proptype 数组？
- 如何有条件地应用样式类？
- React 和 ReactDOM 之间有什么区别？
- 为什么 ReactDOM 从 React 分离出来？
- 如何使用 React label 元素？
- 如何合并多个内联的样式对象？
- 如何在调整浏览器大小时重新渲染视图？
- setState() 和 replaceState() 方法之间有什么区别？
- 如何监听状态变化？
- 在 React 状态中删除数组元素的推荐方法是什么？
- 在 React 中是否可以不在页面上渲染 HTML 内容？
- 如何用 React 漂亮地显示 JSON？
- 为什么你不能更新 React 中的 props？
- 如何在页面加载时聚焦一个输入元素？
- 更新状态中的对象有哪些可能的方法？
- 为什么函数比对象更适合于 setState() ？
- 我们如何在浏览器中找到当前正在运行的 React 版本？
- 在 create-react-app 项目中导入 polyfills 的方法有哪些？
- 如何在 create-react-app 中使用 https 而不是 http？
- 如何避免在 create-react-app 中使用相对路径导入？
- 如何为 React Router 添加 Google Analytics？
- 如何每秒更新一个组件？
- 如何将 vendor prefixes 应用于 React 中的内联样式？
- 如何使用 React 和 ES6 导入和导出组件？
- 为什么 React 组件名称必须以大写字母开头？
- 为什么组件的构造函数只被调用一次？
- 在 React 中如何定义常量？
- 在 React 中如何以编程方式触发点击事件？
- 在 React 中是否可以使用 async/await？
- React 项目常见的文件结构是什么？
- 最流行的动画软件包是什么？
- 模块化样式文件有什么好处？
- 什么是 React 流行的特定 linters？
- 如何发起 AJAX 调用以及应该在哪些组件生命周期方法中进行 AJAX 调用？
- 什么是渲染属性？
- React Router
- 什么是 React Router？
- React Router 与 history 库的区别？
- 在 React Router v4 中的 <Router> 组件是什么？
- history 中的 push() 和 replace() 方法的目的是什么？
- 如何使用在 React Router v4 中以编程的方式进行导航？
- 如何在 React Router v4 中获取查询字符串参数？
- 为什么你会得到 "Router may have only one child element" 警告？
- 如何在 React Router v4 中将 params 传递给 history.push 方法？
- 如何实现默认页面或 404 页面？
- 如何在 React Router v4 上获取历史对象？
- 登录后如何执行自动重定向？
- React Internationalization
- 什么是 React Intl？
- React Intl 的主要特性是什么？
- 在 React Intl 中有哪两种格式化方式？
- 在 React Intl 中如何使用 <FormattedMessage> 作为占位符使用？
- 如何使用 React Intl 访问当前语言环境？
- 如何使用 React Intl 格式化日期？
- React Testing
- 在 React 测试中什么是浅层渲染（Shallow Renderer）？
- 在 React 中 TestRenderer 包是什么？
- ReactTestUtils 包的目的是什么？
- 什么是 Jest？
- Jest 对比 Jasmine 有什么优势？
- 举一个简单的 Jest 测试用例
- React Redux
- 什么是 Flux？
- 什么是 Redux？
- Redux 的核心原则是什么？？
- 与 Flux 相比，Redux 的缺点是什么？
- mapStateToProps() 和 mapDispatchToProps() 之间有什么区别？
- 我可以在 reducer 中触发一个 Action 吗？
- 如何在组件外部访问 Redux 存储的对象？
- MVW 模式的缺点是什么？
- Redux 和 RxJS 之间是否有任何相似之处？
- 如何在加载时触发 Action？
- 在 React 中如何使用 Redux 的 connect() ？
- 如何在 Redux 中重置状态？
- Redux 中连接装饰器的 at 符号的目的是什么？
- React 上下文和 React Redux 之间有什么区别？
- 为什么 Redux 状态函数称为 reducers ？
- 如何在 Redux 中发起 AJAX 请求？
- 我应该在 Redux Store 中保留所有组件的状态吗？
- 访问 Redux Store 的正确方法是什么？
- React Redux 中展示组件和容器组件之间的区别是什么？
- Redux 中常量的用途是什么？
- 编写 mapDispatchToProps() 有哪些不同的方法？
- 在 mapStateToProps() 和 mapDispatchToProps() 中使用 ownProps 参数有什么用？
- 如何构建 Redux 项目目录？
- 什么是 redux-saga？
- redux-saga 的模型概念是什么？
- 在 redux-saga 中 call() 和 put() 之间有什么区别？
- 什么是 Redux Thunk？
- redux-saga 和 redux-thunk 之间有什么区别？
- 什么是 Redux DevTools？
- Redux DevTools 的功能有哪些？
- 什么是 Redux 选择器以及使用它们的原因？
- 什么是 Redux Form？
- Redux Form 的主要功能有哪些？
- 如何向 Redux 添加多个中间件？
- 如何在 Redux 中设置初始状态？
- Relay 与 Redux 有何不同？
- React Native
- React Native 和 React 有什么区别？
- 如何测试 React Native 应用程序？
- 如何在 React Native 查看日志？
- 怎么调试 React Native 应用？
- React supported libraries & Integration
- 什么是 Reselect 以及它是如何工作的？
- 什么是 Flow？
- Flow 和 PropTypes 有什么区别？
- 在 React 中如何使用 Font Awesome 图标？
- 什么 是 React 开发者工具？
- 在 Chrome 中为什么 DevTools 没有加载本地文件？
- 如何在 React 中使用 Polymer？
- 与 Vue.js 相比，React 有哪些优势？
- React 和 Angular 有什么区别？
- 为什么 React 选项卡不会显示在 DevTools 中？
- 什么是 Styled Components？
- 举一个 Styled Components 的例子？
- 什么是 Relay？
- 如何在 create-react-app 中使用 TypeScript？
- Miscellaneous
- Reselect 库的主要功能有哪些？
- 举一个 Reselect 用法的例子？
- Redux 中的 Action 是什么？
- 在 React 中 statics 对象是否能与 ES6 类一起使用？
- Redux 只能与 React 一起使用么？
- 您是否需要使用特定的构建工具来使用 Redux ？
- Redux Form 的 initialValues 如何从状态更新？
- React 是如何为一个属性声明不同的类型？
- 我可以导入一个 SVG 文件作为 React 组件么？
- 为什么不建议使用内联引用回调或函数？
- 在 React 中什么是渲染劫持？
- 什么是 HOC 工厂实现？
- 如何传递数字给 React 组件？
- 我需要将所有状态保存到 Redux 中吗？我应该使用 react 的内部状态吗？
- 在 React 中 registerServiceWorker 的用途是什么？
- React memo 函数是什么？
- React lazy 函数是什么？
- 如何使用 setState 防止不必要的更新？
- 如何在 React 16 版本中渲染数组、字符串和数值？
- 如何在 React 类中使用类字段声明语法？
- 什么是 hooks？
- Hooks 需要遵循什么规则？
- 如何确保钩子遵循正确的使用规则？
- Flux 和 Redux 之间有什么区别？
- React Router V4 有什么好处？
- 您能描述一下 componentDidCatch 生命周期方法签名吗？
- 在哪些情况下，错误边界不会捕获错误？
- 为什么事件处理器不需要错误边界？
- try catch 与错误边界有什么区别？
- React 16 中未捕获的错误的行为是什么？
- 放置错误边界的正确位置是什么？
- 从错误边界跟踪组件堆栈有什么好处？
- 在定义类组件时，什么是必须的方法？
- render 方法可能返回的类型是什么？
- 构造函数的主要目的是什么？
- 是否必须为 React 组件定义构造函数？
- 什么是默认属性？
- 为什么不能在 componentWillUnmount 中调用 setState() 方法？
- getDerivedStateFromError 的目的是什么？
- 当组件重新渲染时顺序执行的方法有哪些？
- 错误处理期间调用哪些方法？
- displayName 类属性的用途是什么？
- 支持 React 应用程序的浏览器有哪一些？
- unmountComponentAtNode 方法的目的是什么？
- 什么是代码拆分？
- 严格模式有什么好处？
- 什么是 Keyed Fragments ？
- React 支持所有的 HTML 属性么？
- HOC 有哪些限制？
- 如何在 DevTools 中调试 forwardRefs？
- 什么时候组件的 props 属性默认为 true？
- 什么是 NextJS 及其主要特征？
- 如何将事件处理程序传递给组件？
- 在渲染方法中使用箭头函数好么？
- 如何防止函数被多次调用？
- JSX 如何防止注入攻击？
- 如何更新已渲染的元素？
- 你怎么说 props 是只读的？
- 你认为状态更新是如何合并的？
- 如何将参数传递给事件处理程序？
- 如何防止组件渲染？
- 安全地使用索引作为键的条件是什么？
- keys 是否需要全局唯一？
- 用于表单处理的流行选择是什么？
- formik 相对于其他 redux 表单库有什么优势？
- 为什么不需要使用继承？
- 我可以在 React 应用程序中可以使用 web components 么？
- 什么是动态导入？
- 什么是 loadable 组件？
- 什么是 suspense 组件？
- 什么是基于路由的代码拆分？
- 举例说明如何使用 context？
- 在 context 中默认值的目的是什么？
- 你是怎么使用 contextType？
- 什么是 consumer？
- 在使用 context 时，如何解决性能方面的问题？
- 在 HOCs 中 forward ref 的目的是什么？
- ref 参数对于所有函数或类组件是否可用？
- 在组件库中当使用 forward refs 时，你需要额外的注意？
- 如何在没有 ES6 的情况下创建 React 类组件
- 是否可以在没有 JSX 的情况下使用 React？
- 什么是差异算法？
- 差异算法涵盖了哪些规则？
- 你什么时候需要使用 refs？
- 对于渲染属性来说是否必须将 prop 属性命名为 render？
- 在 Pure Component 中使用渲染属性会有什么问题？
- 如何使用渲染属性创建 HOC？
- 什么是 windowing 技术？
- 你如何在 JSX 中打印 falsy 值？
- portals 的典型使用场景是什么？
- 如何设置非受控组件的默认值？
- 你最喜欢的 React 技术栈是什么？
- Real DOM 和 Virtual DOM 有什么区别？
- 如何为 React 应用程序添加 bootstrap？
- 你能否列出使用 React 作为前端框架的顶级网站或应用程序？
- 是否建议在 React 中使用 CSS In JS 技术？
- 我需要用 hooks 重写所有类组件吗？
- 如何使用 React Hooks 获取数据？
- Hooks 是否涵盖了类的所有用例？
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论