竹笋

首页 » 问答 » 常识 » 过五关React高频面试题指南
TUhjnbcbe - 2023/1/4 9:43:00
北京皮肤病医治医院 http://pf.39.net/bdfyy/bdfhl/210719/9204079.html

译者:翟珂

谈到前端开发,ReactJS是目前最受欢迎的选择之一。下面列出的是最常问到的ReactJS面试题。

从易到难,让我们看一下五个高频面试题。

为什么不使用Angular而要使用React呢?

使用React构建动态网络应用更简单,因为它编码少功能多,但对于JavaScript应用程序,代码往往会变得复杂。

由于在React应用中使用了虚拟DOM,网络应用的速度会更快。虚拟DOM不会更新实际DOM中的所有组件,而是分析其先前的状态,只更新那些已经改变的组件。

换句话说,每个React项目的构件可以通过使用组件创建新的构件来重新使用。为了节省开发时间,这些预建的组件都封装了自己的逻辑和控制,可以在整个程序中共享。

React有单向的数据流。在React应用程序的设计过程中,我们通常将子组件分层在其父组件内。由于数据以单一渠道流动,故障排除也更简单,更容易确定程序中的问题所在。

Facebook已经发布了一个浏览器插件,使我们能够更容易地调试React应用程序。由于这一改进,调试React网络应用变得更快、更简单了。

Reduxthunks的作用是什么?

使用Reduxthunk,你可以建立返回函数而不是动作的动作创建器。通过使用delay函数,一个动作可以被延迟,直到满足一个特定的条件。你可以将两个存储方法getState和dispatch传递给内部函数。

必须先使用applyMiddleware()方法:

复制

import{createStore,applyMiddleware}fromredux;importthunkfromredux-thunk;importrootReducerfrom./reducers/index;conststore=createStore(rootReducer,applyMiddleware(thunk));1.2.3.4.5.6.7.

React中的useState()是做什么的?

useState()ReactHook允许在功能组件中使用状态变量。这种方法对于动态控制DOM是非常好的。

SetCounter方法是UseState(0)的第二个参数,它返回一个元组,count是第一个参数,setCounter方法是第二个参数。

复制

..const[count,setCounter]=useState(0);const[otherStuffs,setOtherStuffs]=useState(..);..constsetCount=()={setCounter(count+1);setOtherStuffs(..);..};1.2.3.4.5.6.7.8.

要更新count,可以使用setCounter()方法。在这个例子中,SetCounter()是在setCount方法中使用的,这里可以采取各种不同的行动。当我们使用钩子时,我们可能使我们的代码更有用,如果不是绝对必要的话,可以避免使用基于类的组件。

useEffect钩子有用吗?

useEffectReactHook可以用来在功能组件中产生边际效用。如果你的组件需要在渲染后或状态改变后进行某些操作,那么你可以使用useEffect来通知React。

React会记住并在DOM更新性能完成后立即执行你提供的函数。除了更新页面标题之外,这个函数也可以用来从Web服务器上获取数据。

useEffect钩子会在组件的第一次渲染和随后的每次更新后自动启用。完成后,DOM将被修改。

用于React的钩子。可以用两个参数来使用useEffect:

useEffect(callback[,dependencies])

回调1代表包含边际效用的函数,它在DOM修改后立即被调用。第二个参数的依赖数组可以是你想要的任何东西。只要渲染之间的依赖关系改变,useEffect()就会被调用。

复制

import{useEffect}fromreact;functionWel

1
查看完整版本: 过五关React高频面试题指南