map 순회

return 안에 jsx로 이런식으로 {}안에 map을 동작시켜 태그를 리턴한다

• return시 태그의 경우 ()괄호를 꼭 붙여야한다.

key의 유무

리액트가 key를 기준으로 엘리먼트 추가/수정/삭제 등을 판단하고, 같은 컴포넌트의 여부를 판단하여 성능 최적화하는데 사용된다.
key 값을 임의로 index로 설정하는 경우가 있는데 배열의 순서가 바뀌면 리액트에서 무엇이 바뀌었는지 판단하기가 어려워져 성능 최적화에 문제가 생길 수 있으므로 피하는 것이 좋다.

컴포넌트 분리 이유

1. 가독성
2. 재사용
3. 성능최적화

props 전달

마치 html의 attribute(속성)과 비슷
컴포넌트의 props 부여 => 부모로부터 받은 유산

Try 컴포넌트의 value={v}와 index={i}를 props로 이용한다

출처

key