React Quiz

Q : Which value should you pass to event listener props like onClick?
onClick과 같은 이벤트 리스너 소품에 어떤 값을 전달해야 하나?

A : A pointer at the function that should execute when the event occurs.
이벤트가 발생할 때 실행되어야 하는 함수에 대한 포인터.

+ That's the correct choice - you want to pass a "pointer" at the to-be-executed function as a value to onClick etc. Then, this function gets executed "on your behalf" by React when the event occurs.
onClick 등에 대한 값으로 실행할 함수의 "포인터"를 전달하고 싶습니다. 그런 다음 이 함수는 이벤트가 발생할 때 React에 의해 "대신" 실행됩니다.

 

Q : How can you communicate from one of your components to a parent (i.e. higher level) component?

A : You can accept a function via props and call it from inside the lower-level (child) component to then trigger some action in the parent component (which passed the function)
props를 통해 함수를 수락하고 하위 수준(자식) 구성 요소 내부에서 호출하여 상위 구성 요소 (함수를 전달한)에서 일부 작업을 트리거할 수 있습니다.

+ In JavaScript, functions are just objects (i.e. regular values) and hence you can pass them as values via props to a component. If that component then calls that function, it executes - and that's how you can trigger a function defined in a parent component from inside a child component.
JavaScript에서 함수는 객체(즉, 일반 값)이므로 props를 통해 구성 요소에 값으로 전달할 수 있습니다. 그런 다음 해당 구성 요소가 해당 함수를 호출하면 실행됩니다. 이는 하위 구성 요소 내부에서 상위 구성 요소에 정의된 함수를 트리거하는 방법입니다.

 

Q : How can you change what a component displays on the screen?

A : Create some "state" value (via useState) which you can then change and output in JSX.
useState를 통해 "상태"값을 만든 다음 JSX에서 변경하고 출력할 수 있다.

 

Q : Why do you need this extra "state" concept instead of regular JS variables which you change and use?
변경하고 사용하는 일반 JS 변수 대신 이 추가 "상태" 개념이 필요한 이유는 무엇입니까?

A : Because standard JS variables don't cause React components to be re-evaluated
표준 JS 변수로 인해 React 구성 요소가 재평가되지 않기 때문이다.

+ React doesn't care whether you changed some variable values. It'll not re-evaluate the component function. It only does that for changes to registered state values (created via useState)
React는 일부 변수 값을 변경했는지 여부를 신경 쓰지 않습니다. 구성 요소 기능을 다시 평가하지 않습니다. 등록된 상태 값(useState를 통해 생성됨)에 대한 변경에만 적용됩니다.

 

 

Q : Which statement about useState is NOT correct?

A : it receives an (optional) initial state value as an argument
초기 상태 값을 인수로 받는다.
A : it returns an array with exactly two elements
정확히 두 개의 요소가 있는 배열을 반환한다.
A : Calling useState again will update the state value ❌

+ because this statement is wrong. Calling useState again will simply create a new state.
useState를 다시 호출하면 단순히 새 상태가 생성됩니다.

 

Q : How can you update component state (created via useState)?

A : You can call the state updating function which useState also returned
useState도 반환한 상태 업데이트 함수를 호출할 수 있다.

+ useState returns an array with exactly two elements - the second element is always a function which you can call to set a new value for your state. Calling that function will then also trigger React to re-evaluate the component.useState는 정확히 두 개의 요소가 있는 배열을 반환합니다. 두 번째 요소는 항상 상태에 대한 새 값을 설정하기 위해 호출할 수 있는 함수입니다. 그런 다음 해당 함수를 호출하면 React가 구성 요소를 다시 평가하도록 트리거 됩니다.

 

Q : How much state may you manage in one single component?

A : You can have as many state slices as you need / want.

+ There's no restriction at all.

---

※ 출처 : https://www.udemy.com/course/react-the-complete-guide-incl-redux/learn/quiz/5187764#overview