💡 페이지를 (재)렌더링 하게 되는 경우들1. 첫 리액트 앱이 실행될 때2. 현재 리액트 내부의 어떤 상태(state)가 변경되었을 때컴포넌트 내부 `state`가 변경될 때컴포넌트에 새로운 `props`가 들어올 때부모 컴포넌트가 위와 같은 이유로 렌더링이 될 때 자식 컴포넌트도 줄줄이 렌더링
💡 state의 변화 유무리액트에서는 화면을 리렌더링 할 때 state의 변화를 가지고 판단한다. 즉, 일반 변수값을 화면에 출력한 상태에서 변수 값을 바꾼다고 화면에 출력된 값이 변경되는 것이 아니라 `setState` 를 활용해서 변경해야 적용 된다. 이 때 state의 변화 전, 후 의 `메모리 주소` 를 비교한다. 따라서 `참조 데이터 타입`이 변하게 되면 값은 바뀌지만 메모리 주소는 변함이 없기 때문에 페이지가 리렌더링 되지 않는다. (깊은 복사, 얕은 복사 개념) 📍 참조 데이터 타입(객체, 배열) 업데이트 하는 방법
구조 분해 할당구조 분해 할당(Destructuring)은 객체나 배열의 속성을 분해하여 변수에 값을 쉽게 할당 및 추출할 수 있는 문법이다. 특히 함수의 매개변수가 많아질 때 사용하면 아주 기분이 좋아진다. 가독성과 유지보수가 좋아진다. 기본 문법const obj = { name: "길동", age: 30,}const { name, age } = obj;console.log(name, age); // 길동 30`name`과 `age` 속성이 있는 `obj`객체를 정의'`const {name, age} = obj`': `obj` 속성에 정의된 값들을 `name`과 `age`에 할당이 때 `obj` 의 속성명과 같은 변수에 값을 할당순서는 상관 없음변수가 더 많거나 적어도 상관 없고, 속성명..