[코드잇 스프린트] 0411 데일리 퀴즈

 

1. 리액트에서 명시적으로 key를 지정해야하는 이유를 설명해주세요.

 

Key는 React에서 element list를 만들 때 포함해야 하는 문자열 속성으로, 어떤 항목을 변경, 추가 또는 삭제할지 식별하는 것을 돕는다. 주의할 점은 key 값을 배열의 index로 지정할 경우, 배열의 순서가 바뀌면 key도 변경되기 때문에 key는 id와 같은 고유한 속성을 넣어주어야 한다. 

2. 리액트가 화면에 페이지를 그리는 과정을 설명해주세요

 

props나 state가 변경될 때 리렌더링이라는 과정을 통해서 화면에 페이지를 그린다. 

만약 상태나 속성값이 변경된 경우, 변경된 값으로 React는 가상의 돔을 그리게 된다. 그린 Virtual DOM과 Real DOM을 비교하여 변경된 사항만 반영하여 해당 내용을 실제 돔에서 수정한 이후 새로운 화면을 렌더링 한다.

 

3. 리액트의 prop에 대해 설명해주세요.

 

props는 properties의 줄임말로, 우리가 어떤 값을 컴포넌트에게 전달해줘야 할 때 사용하는 속성이다.

상위 컴포넌트가 하위 컴포넌트에게 값을 전달할 때 사용한다. 또한 프로퍼티는 수정할 수 없다.

프로퍼티에 문자열을 전달할 때는 큰따옴표, 문자열 외의 값을 전달할 때는 중괄호{}를 사용한다.

4. 리액트의 state에 대해 설명해주세요.

 

state는 컴포넌트의 내부 상태를 관리하기 위한 것으로, 동적인 데이터를 다룰 때 사용된다. 

state는 컴포넌트 내부에서 변경 가능하며, 변경될 때마다 리액트는 해당 컴포넌트를 다시 렌더링하여 새로운 상태를 반영한다.

 

- props와의 차이점

props (“properties”의 줄임말) 와 state 는 일반 JavaScript 객체이다. 두 객체 모두 렌더링 결과물에 영향을 주는 정보를 갖고 있는데, 한 가지 중요한 방식에서 차이가 있다. props는 (함수 매개변수처럼) 컴포넌트에 전달되는 반면 state는 (함수 내에 선언된 변수처럼) 컴포넌트 안에서 관리된다.