React
2 posts
React - 리액트 컴포넌트 Props 와 Object

1️⃣ 리액트 컴포넌트의 Props 란 Props 는 Property의 약자로 리액트에서는 상위 컴포넌트가 하위 컴포넌트에 값을 전달할때 사용하는 옵션을 일컫습니다. 상위 컴포넌트가 하위 컴포넌트에게 전달하기 때문에 단방향 데이터 흐름을 갖는다는 특성을 갖고 있습니다. 뿐만 아니라 부모 컴포넌트에서 넘겨준 값을 자식컴포넌트에서 받을때는 하나의 Object 형태로 받게 되며, 각 내부 값은 부모 컴포넌트에서만 수정이 가능하다는 특성을 갖고 있습니다. 2️⃣ 자바스크립트 의 Object 란 자바스크립트는 *객체(Object) 기반 프로그래밍 언어로 자바스크립트를 구성하는 대부분의 것들이 객체 로 이루어져있습니다. 원시형값(number, string, boolean…) 을 제외한 나머지 값**(함수, 배열, 객체, Set, Map, 정규 표현식) 은 모두 객체 구조**를 갖습니다. 객체(*Object) 와 원시타입의 근본적인 차이 중 하나는 참조에 의해 저장되고 복사된다는 점입니다. 특정 변수…

May 03, 2023
블로그
React
React.useEffect 와 dependencies Array

😃 서론 React를 사용하다 보면 특정 컴포넌트가 화면에 그려질때 API를 호출하여 데이터를 가져오는등 특수한 로직을 수행해야할때가 있습니다. 이럴때 우리는 일반적으로 useEffect를 많이 활용하게 됩니다. 이렇듯 useEffect는 특정한 컴포넌트가 랜더될때(그려질 때) 특수한 로직을 처리하기 위해 사용되는 React의 공식 hook중 하나입니다. useEffect는 첫 랜더시에만 특정 로직이 동작하게 할 수도 있지만 dependencies array 를 통해 특정 값들이 변화되었을때만 특정 로직이 동작하도록 할수도 있습니다. 이처럼 의도치 않은 상황에 변화를 만드는 함수를 Side effect function 이라고 하는데요, 공식적으로 제공되는 hook들 중에는 useEffect 말고도 useMemo, useCallback 등이 있습니다. 여기서 제가 집중에서 이야기를 해보고 싶은 내용은 dependencies array 를 통한 useEffect 내부 로직수행 과정입니…

February 23, 2023
블로그
React