React에서 State와 Props는 어떤 차이가 있을까?

1. Props란?

Props란 컴포넌트 간에 데이터를 전달하기 위해 사용됩니다.

부모 컴포넌트에서 자식 컴포넌트로 단방향으로 데이터를 전달할 때 사용되며, 자식 컴포넌트는 전달 받은 `props`를 읽기 전용으로 사용하게 됩니다.

 

2. State란?

State란 컴포넌트 내부에서 관리되는 상태를 나타냅니다.

상태가 변경되면 컴포넌트는 리렌더링이 일어나게 됩니다.

컴포넌트 외부에서는 직접 접근할 수 없습니다.

 

3. 그렇다면 Props와 State의 차이점은 무엇이 있을까?

• 데이터의 소유와 제어
  • Props: 부모 컴포넌트가 소유하고 제어함.
  • State: 해당 컴포넌트 내부에서 소유하고 제어함.
• 변경 가능성
  • Props: 읽기 전용.
  • State: 컴포넌트 내에서 업데이트 가능.
• 데이터 흐름
  • Props: 부모에서 자식으로 단방향.
  • State: 해당 컴포넌트 내부에서만 관리되고 사용됨.
• 용도
  • Props: 컴포넌트간 데이터 전달에 사용.
  • State: 컴포넌트 내부의 동적 데이터 관리에 사용.