map()

자바스크립트 배열 객체의 내장함수 map 함수를 사용하여 반복되는 컴포넌트를 렌더링할 수 있다.

 

ex) arr.map(callback, [thisArg])

callback : 새로운 배열의 요소를 생성하는 함수로 파라미터는 3가지를 가진다.

- currentValue : 현재 처리하고 있는 요소

- index : 현재 처리하고 있는 요소의 index 값

- array : 현재 처리하고 있는 원본 배열

thisArgs(선택항목) : callback 함수 내부에서 사용할 this 레퍼런스

 

key : 컴포넌트 배열을 렌더링 했을 때 어떤 원소에 변동이 있었는지 알아내기 위해 사용, list를 순차적으로 비교하지 않아고 어떠한 변화가 일어났는지 빠르게 알아낼 수 있다.

 

key설정 : map 함수의 인자로 전달되는 함수 내부에서 컴포넌트 props를 설정하듯 설정하면되나 key값은 언제나 유일해야 한다.

 

push : 기존배열자체 변경

concat :  새로운 배열을 만들어준다.

불변성 유지 : 리액트에서는 기존 상태를 그대로 두고 새로운 값을 만드는 것이 좋다.

filter 함수 : 배열에서 특정 조건을 만족하는 원소들 분류 할 수 있다.