리액트를다루는기술

[React] 컴포넌트의 라이프사이클 메서드

모든 리액트 컴포넌트에는 라이프사이클이 존재 컴포넌트가 브라우저상에 나타나고, 업데이트되고, 사라지게 될 때 호출되는 메서드 + 에러가 나타났을 때 호출되는 메서드 라이프사이클 메서드는 클래스형 컴포넌트에서만 사용 가능 함수컴포넌트에서는 사용할 수 없음 그 대신 Hooks 기능을 사용하여 비슷한 작업을 처리할 수 있음 앞으로 사용할 일이 별로 없어 이 개념에 너무 많은 시간을 쏟지 말 것. 마운트(mount) DOM이 생성되고 웹 브라우저상에 나타나는 것 constructor : 컴포넌트를 새로 만들 때마다 호출되는 클래스 생성자 메서드 getDerivedStateFromProps : props에 있는 값을 state에 넣을 때 사용하는 메서드 render : 우리가 준비한 UI를 렌더링하는 메서드 co..

[React] 컴포넌트 반복

반복적인 내용을 효율적으로 보여주고 관리하는 방법 map() 함수 자바스크립트 배열 객체의 내장 함수 기존 배열로 새로운 배열을 만드는 역할 파라미터로 전달된 함수를 사용해 배열 내 각 요소를 원하는 규칙에 따라 변환한 후 그 결과로 새로운 배열 생성 문법 arr.map(callback, [thisArg]) callback : 새로운 배열의 요소를 생성하는 함수 currentValue : 현재 처리하고 있는 요소 index : 현재 처리하고 있는 요소의 index 값 array : 현재 처리하고 있는 원본 배열 thisArg(선택 항목) : callback 함수 내부에서 사용할 this 레퍼런스 예제 const numbers = [1, 2, 3, 4, 5]; const processed = numbers..