본문 바로가기

useEffect

[React] React Hook 동작 원리(useState,useEffect)
Frontend/React 2023. 1. 16. [React] React Hook 동작 원리(useState,useEffect) 렉시컬 스코프, 클로저에 대한 공부를 하고 hook의 동작 원리에 대해 궁금해져 공부해 본 것에 대한 기록이다. 개요 지난 JS 기록에서 렉시컬 스코프와 클로저에 대해 다뤘다. [JS] 클로저를 이용한 정보 은닉 구현(클로저, 렉시컬 스코프 개념) 일급 객체를 공부하다 보니 렉시컬 스코프, 클로저에 대한 궁금증이 생겨 이에 대해 공부한 기록이다. Lexical Scope 렉시컬 스코프는 말 그대로 어휘의 범위이다. 변수가 사용 가능한 범위를 알기 choi-records.tistory.com 위의 기록에서 나아가 React Hook의 동작 원리를 이해해보려고 한다. 먼저 useState, useEffect 순서로 원리를 이해하고, 이를 바탕으로 다른 Hook들이 어떻게 작동하는지에 대한 원리를 이해할 것이..
[React] React useEffect/componentDidMount/componentDidUpdate/componentWillUnmount
Frontend/React 2022. 7. 14. [React] React useEffect/componentDidMount/componentDidUpdate/componentWillUnmount useEffect 역할 componentDidMount : 컴포넌트가 mount 된 직후의 작업을 해준다. componentDidUpdate : 컴포넌트에서 Update가 일어난 후에 작업을 해준다. componentWillUnmount : 컴포넌트가 unmount되기 직전의 작업을 해준다. Mount나 Update는 리액트의 생명주기에 관한 내용이다. useEffect 사용법 기본 형태 : useEffect(effect function, dependency array) effect function : 컴포넌트가 mount 됐을 때, update 됐을 때 실행할 함수를 정한다. dependency array : 이 배열의 값이 변할 때만 update 된 것으로 전달한다. import "./styles.c..

티스토리툴바