React _ Map을 사용한 배열 렌더링

React _ Map을 사용한 배열 렌더링

 

 

아래와 같이 코드 그대로 길게 작성하는 방법은 react의 컴포넌트 기능을 이용하지 못한 비효율적인 방법이다.

 

 

 

컴포넌트를 재사용 할 수 있도록 수정.

 

 

자바스크립트 배열의 내장함수 map() 을 사용하여 배열 렌더링.

 

 

 

 

위의 세가지 방법에 대한 결과는 아래와 같이 모두 같다.