클로저
[React] useState의 동작 원리와 클로저
useState hook은 함수형 컴포넌트의 상태 관리 문제를 클로저를 통해 해결합니다. 이 글을 통해 간단한 useState hook을 단계별로 직접 구현해보겠습니다. 매 단계마다 어떠한 문제를 만나 어떻게 해결하는지의 과정을 이해해봅시다. (아래의 글들이 useState를 이해하는데 많은 도움이 되었습니다.) swyx의 Deep dive: How do React hooks really work? Rudi Yardley의 React hooks: not magic, just arrays 여울코딩님의 클로저와 useState Hooks 함수형 컴포넌트의 상태 관리 클래스형 컴포넌트는 render() 메서드를 통해 상태 변경을 감지할 수 있습니다. 반면 함수형 컴포넌트는 렌더링이 발생하면 함수 자체가 다시 ..
[JavaScript] 실행 컨텍스트 (Execution Context)
실행 컨텍스트는 실행할 코드에 관한 환경 정보들을 모아놓은 객체입니다. 실행 컨텍스트는 scope, hoisting, this, closure 등의 많은 개념을 포함하고 있습니다. 그래서 동적 언어인 JavaScript를 이해하는 핵심 개념이기도 합니다. 이 글을 통해 실행 컨텍스트의 구조 및 동작 방식에 대해 알아보겠습니다. 먼저 실행 컨텍스트가 구성되는 코드들은 다음과 같습니다. 전역 코드 eval 코드 함수 코드 모듈 코드 1. 실행 컨텍스트의 구조 JavaScript 엔진은 실행 컨텍스트의 추상화된 정보들을 물리적 객체 형태로 관리합니다. 1.1 변수 객체 (VO, Variable Object) 변수 객체가 담고 있는 정보들은 다음과 같습니다. 변수 매개변수(parameter)와 인수 정보(arg..