2022必备react面试题 附答案

2022必备react面试题

1. React的严格模式如何使用，有什么用处？

StrictMode 是一个用来突出显示应用程序中潜在问题的工具。与 Fragment 一样，StrictMode 不会渲染任何可见的 UI。它为其后代元素触发额外的检查和警告。 可以为应用程序的任何部分启用严格模式。例如：

import React from 'react';
function ExampleApplication() {
   
  return (
    <div>
      <Header />
      <React.StrictMode>        
        <div>
          <ComponentOne />
          <ComponentTwo />
        </div>
      </React.StrictMode>      
      <Footer />
    </div>
  );
}
复制代码

在上述的示例中，不会对 Header 和 Footer 组件运行严格模式检查。但是，ComponentOne 和 ComponentTwo 以及它们的所有后代元素都将进行检查。

StrictMode 目前有助于：

• 识别不安全的生命周期
• 关于使用过时字符串 ref API 的警告
• 关于使用废弃的 findDOMNode 方法的警告
• 检测意外的副作用
• 检测过时的 context API

前端react面试题详细解答

2. 在React中遍历的方法有哪些？

（1）遍历数组：map && forEach

import React from 'react';

class App extends React.Component {
   
  render() {
   
    let arr = ['a', 'b', 'c', 'd'];
    return (
      <ul>
        {
   
          arr.map((item, index) => {
   
            return <li key={
   index}>{
   item}</li>
          })
        }
      </ul>
    )
  }
}

class App extends React.Component {
   
  render() {
   
    let arr = ['a', 'b', 'c', 'd'];
    return (
      <ul>
        {