state3 [React] State - 함수형 컴포넌트의 state와 주의점 지난번에 클래스형 컴포넌트의 state를 다뤘습니다. 이번엔 함수형 컴포넌트의 state를 다룰 차례입니다. 함수형 컴포넌트에서는 바로 state에 접근할 수 없고 useState 함수를 통해서 state에 접근할 수 있습니다. 1. useState useState 함수는 함수형 컴포넌트에서 state를 조작할 수 있게 해주는 기능입니다. useState는 Hooks 기능 중 하나입니다. useState 함수가 처음 만나게되는 Hooks 가 되겠네요. 이것을 배우기 위해 '배열 비구조화 할당'이란것을 사용하겠는데, 이것에 대한 설명은 아래를 참조해주세요. https://bamtory29.tistory.com/entry/Javascript-%EA%B5%AC%EC%A1%B0-%EB%B6%84%ED%95%B4.. 2021. 11. 3. [React] State - state의 소개와 클래스형 컴포넌트의 state 지난 포스트에서는 컴포넌트의 속성인 props를 공부했었습니다. 이번에 배우는 stete는 컴포넌트 내부에서 변경될 수 있는 값입니다. 1. state state는 컴포넌트 내부에서 바뀔 수 있는 값 입니다. props와의 차이점은 props는 컴포넌트에서 사용되기 위해 부모 컴포넌트가 설정해주는 값이기에 값을 바꾸기 위해서는 부모 컴포넌트에서만 접근했어야 합니다. 그래서 props는 마치 함수의 인자 처럼 외부에서 컴포넌트로 전달 되었습니다. 반면 state는 현재 컴포넌트에서 값이 바뀔 수 있다는 차이점이 있습니다. 그래서 state는 마치 함수(클래스) 내부에서 선언되어 사용되는 변수처럼 컴포넌트 내부에서 자유롭게 이용할 수 있습니다. 또 이전에 함수형과 클래스형 컴포넌트를 소개하면서 state 사.. 2021. 11. 3. 스테이트 패턴 State Pattern State는 상태라는 의미를 가지고 많이 쓰이는 단어입니다. 이처럼 상태에 따라 객체를 변환할 때 이용하는 패턴이 스테이트 패턴입니다. 1. 스테이트 패턴 스테이트 패턴은 객체 내부의 상태에 따라 동작을 변환할 때 이용하는 패턴입니다. 스테이트 패턴을 이용하면, 객체에 대해 여러 동작을 정의할 때 스테이트 객체만 수정, 추가하면 됩니다. 또한 스테이트 패턴을 사용하지 않을경우 조건문 등을 이용해서 동작을 제어해야하는데 스테이트 객체를 이용함으로써 클래스 코드가 간단해집니다. 단, 상태에 따라서 스테이트 객체가 증가하기 때문에, 동작이 많아질 경우 스테이트 객체가 늘어난다는 단점도 갖고 있습니다. 2. 스테이트 패턴 구현하기 오락실이나 뽑기 기계 근처에 가면 항상 동전 교환기계가 있습니다. 이 기계는 스테.. 2021. 9. 29. 이전 1 다음 300x250
