예제는 아주 간단한 예제이지만 처음에 React를 접하고 나서 잘 이해가 가지 않았지만 몇번을 보고 나서는 이해 하게 되었다. 특히 앞선 클로저를 이해하고 나서는 왜 변경함수를 통하여 현재 상태값을 변경하는지도 이해하기 쉬웠던거 같다. 비록 간단한 예제 이지만 처음으로 React를 접하는 분들에게는 꼭 useState를 잘 이해하기를 바랍니다. 전체적인 컴포넌트 구조는 아래와 같다. 위의 화면은 Todo 예제 전체 컴포넌트 구조 이다. 부모 컴포넌트는 Todo 이고 자식 컴포넌트는 TodoForm, TodoList 로 구성 된다. [Todo.jsx] import React, { useState } from "react"; import TodoForm from "./TodoForm."; import Tod..

useState Hook은 아래와 같이 현재상태값, 상태변경함수를 반환하여 준다. setState 함수를 통하여 상태값이 변경이 되면 컴포넌는 Re-redering이 된다. const [state, setState] = useState(초기값); 궁금했던 점은 setState 함수는 호출 하고 나서 실행컨텍스트스택에서 setState는 제거 되는데 현재상태값을 어떻게 가져 올 수 있는지 였다. 상태값을 가져올 수 있는 이유는 클로저(closure)로 구현 되어 있기 때문이다. 클로저에 대한 이해 클로저에 대한 이해 에 대한 예제와 내용은 모던 자바스크립트 Deep Dive 책의 코드와 내용을 정리한 것입니다. 클로저에 대한 MDN의 정의는 다음과 같다. A closure is the combination..