[React.js] Quiz_09_20

Q.

 

> 객관식

문제 1:

React에서 useEffect 훅에서 cleanup 함수는 언제 실행되나요?

• A) 컴포넌트가 처음 마운트될 때
• B) 컴포넌트가 언마운트될 때와 useEffect가 재실행되기 직전에
• C) 컴포넌트가 업데이트될 때마다
• D) 상태가 변경될 때마다

문제 2:

React에서 useMemo 훅은 주로 어떤 상황에서 사용되나요?

• A) 컴포넌트가 처음 렌더링될 때만 함수를 실행하고 싶을 때
• B) 복잡한 계산을 수행할 때 계산 결과를 메모이제이션하여 불필요한 재계산을 방지할 때
• C) 컴포넌트 간의 데이터를 공유하고 싶을 때
• D) 상태 업데이트가 필요할 때

문제 3:

React에서 shouldComponentUpdate 생명주기 메서드와 유사한 훅은 무엇인가요?

• A) useEffect
• B) useCallback
• C) useMemo
• D) React.memo

문제 4:

React에서 Context API를 사용할 때, Provider와 Consumer의 주요 역할은 무엇인가요?

• A) Provider는 데이터를 제공하고 Consumer는 데이터를 처리한다
• B) Provider는 전역 상태를 설정하고 Consumer는 전역 상태를 읽는다
• C) Provider는 컴포넌트의 상태를 업데이트하고 Consumer는 그 상태에 반응한다
• D) Provider는 함수형 컴포넌트에서만 사용할 수 있고, Consumer는 클래스형 컴포넌트에서만 사용할 수 있다

문제 5:

React의 useReducer 훅은 주로 어떤 상황에서 사용하는 것이 좋나요?

• A) 상태가 복잡하고 다단계의 업데이트 로직이 필요한 경우
• B) 단순한 상태 업데이트가 필요한 경우
• C) 컴포넌트 렌더링 성능을 최적화할 때
• D) 데이터를 외부 API에서 받아올 때

> 주관식

문제:

React에서 useCallback 훅은 어떤 상황에서 사용되며, 이 훅을 사용하면 어떤 성능상의 이점이 있는지 설명하세요.

 

 

 

 

A.

 

> 객관식

 

문제 1: React에서 useEffect 훅에서 cleanup 함수는 언제 실행되나요?

• 정답: B) 컴포넌트가 언마운트될 때와 useEffect가 재실행되기 직전에
• 설명: useEffect에서 반환하는 cleanup 함수는 컴포넌트가 언마운트되기 전에 또는 useEffect가 재실행되기 전에 실행됩니다. 이를 통해 메모리 누수를 방지할 수 있습니다.

문제 2: React에서 useMemo 훅은 주로 어떤 상황에서 사용되나요?

• 정답: B) 복잡한 계산을 수행할 때 계산 결과를 메모이제이션하여 불필요한 재계산을 방지할 때
• 설명: useMemo 훅은 복잡하거나 비용이 큰 연산을 메모이제이션하여, 동일한 입력값이 주어졌을 때 불필요한 재계산을 방지하는 데 사용됩니다.

문제 3: React에서 shouldComponentUpdate 생명주기 메서드와 유사한 훅은 무엇인가요?

• 정답: D) React.memo
• 설명: React.memo는 컴포넌트의 props가 변경되지 않으면 재렌더링을 방지하는 최적화 기법으로, 클래스형 컴포넌트의 shouldComponentUpdate 메서드와 유사한 역할을 합니다.

문제 4: React에서 Context API를 사용할 때, Provider와 Consumer의 주요 역할은 무엇인가요?

• 정답: B) Provider는 전역 상태를 설정하고 Consumer는 전역 상태를 읽는다
• 설명: Provider는 전역 상태나 데이터를 설정하는 역할을 하고, Consumer는 그 데이터를 읽고 사용할 수 있도록 해줍니다. 이를 통해 여러 컴포넌트 간에 데이터를 공유할 수 있습니다.

문제 5: React의 useReducer 훅은 주로 어떤 상황에서 사용하는 것이 좋나요?

• 정답: A) 상태가 복잡하고 다단계의 업데이트 로직이 필요한 경우
• 설명: useReducer 훅은 상태 업데이트 로직이 복잡하거나 여러 단계로 이루어질 때, 또는 여러 상태를 다루는 경우에 적합합니다. 이를 통해 복잡한 상태 관리를 보다 구조적으로 처리할 수 있습니다.

 

> 주관식

 

 

• useCallback 훅은 함수의 메모이제이션을 위해 사용됩니다. 이 훅은 주로 자식 컴포넌트에 함수를 props로 전달할 때, 함수가 불필요하게 재생성되는 것을 방지하기 위해 사용됩니다. 이를 통해 성능 최적화를 이룰 수 있습니다.
• 함수의 참조 무결성을 유지하기 위해 사용하며, 의존성 배열([])에 지정된 값이 변경되지 않는 한 동일한 함수가 재사용됩니다.