1。 useState 和 useRef 之间有什么区别？
答：-
useState 用于在函数组件中声明状态变量。当状态改变时，组件会重新渲染。
useRef 返回一个可变的 ref 对象，其 .current 属性使用传递的参数 (initialValue) 进行初始化。
返回的对象将在组件的整个生命周期内持续存在。
useRef 的一个常见用例是强制访问子组件的属性。需要注意的是，对 ref 的 .current 属性的更改不会导致组件重新渲染。
2。 React 中的门户是什么？
假设在某些场景下我们需要在根 DOM 节点之外渲染一个组件，这里我们可以使用 Portal。
我们可以将它用于 Modal / 一些 Pop-up 组件。
3。为什么我们需要 super in class 组件？
答：-
在调用 super() 之前，子类构造函数无法使用 this 引用。
如果你不调用 super()，JavaScript 将抛出错误，因为它没有初始化。这是因为在调用 super() 之前，子类上下文中的 this 尚未初始化。
class Parent {
constructor() {
this.name = 'Parent';
}
}
class Child extends Parent {
constructor() {
super(); // Must call super() here
this.name = 'Child';
}
}
4。 useCallback vs useMemo vs React.memo
答：-
import React, { useState, useCallback } from 'react';
function Example() {
const [count, setCount] = useState(0);
const increment = useCallback(() => {
setCount(count + 1);
}, [count]);
return (
<div>
<p>You clicked {count} times</p>
<button onClick={increment}>
Click me
</button>
</div>
);
}
import React, { useState, useMemo } from 'react';
function Example() {
const [count, setCount] = useState(0);
const expensiveValue = useMemo(() => {
// Perform expensive calculation here
return computeExpensiveValue(count);
}, [count]);
return (
<div>
<p>Expensive value: {expensiveValue}</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
import React from 'react';
const MyComponent = React.memo(function MyComponent(props) {
// render logic here
});
export default MyComponent;
注意：-
useCallback 用于记忆函数，useMemo 用于记忆值，React.memo 用于记忆组件。
5。如果我们过度使用上面的 useMemo、Memo 和 useCallback 功能会发生什么？
内存使用情况：
性能问题：
虽然这些钩子和 React.memo 旨在优化性能，但过度使用它们实际上会产生相反的效果。
例如，useMemo 和 useCallback 都有成本，如果它们阻止的计算不比使用钩子的成本更昂贵，则最终可能会降低性能。
6。 React 组件与 React 元素有什么区别？
答：-
反应组件：
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
反应元素：
const element = <h1>Hello, world</h1>;
ReactDOM.render(element, document.getElementById('root'));
7。 Redux的核心原理？
答：-
8。区分算法、协调和 React Fiber？
答：- 同一文章的单独文章
深入探讨 React 的优化算法和流程
9。 React 中的综合事件是什么？
Ans：- 我们确保事件在不同浏览器之间应该保持一致。
例如：- PreventDefault()、stopPropagation()
10。提升状态？
Ans:- 当多个组件需要共享相同的变化数据时，建议将共享状态提升到它们最近的共同祖先。
以上是反应面试准备的详细内容。更多信息请关注PHP中文网其他相关文章！
