1) 컴포넌트
- props를 input으로 하고 UI가 어떻게 보여야 하는지 정의하는 React Element를 output으로 하는 함수
- 합성을 이용하여 UI를 재사용할 수 있고 독립적인 단위로 쪼갠다.
- UI를 구성하기 위해서는 화면에 컴포넌트를 그리고(Mounting), 갱신하고(Updating), 지워야(Unmounting) 한다.
2) props, state, 이벤트
- props : 부모 컴포넌트가 자식 컴포넌트에 값을 전달할때 사용, 읽기전용
- state : 컴포넌트 자기 자신이 가지고 있는 값, setState()함수를 통해 변경 가능
- event : 소문자 대신 카멜케이스 사용, 문자열이 아닌 함수로 이벤트 핸들러 전달
3) 추가, 삭제
- map() : 각 배열의 요소를 돌면서 인자로 전달된 함수를 사용하여 처리된 새로운 결과를 새로운 배열에 담아 반환하는 함수(map형태 : arr.map(callback, [thisArg]))
- key : 어떤 항목을 변경·추가 또는 삭제할지 식별하는것을 도움, 컴포넌트를 렌더링 했을때 어떤 원소가 변경되었는지 빠르게 감지하기 위해 key 설정, 엘리먼트에 안정적인 고유성을 부여하기 위해 배열 내부의 엘리멘트에 지정해야함, 데이터가 가진 고유값으로 설정
- spared 연산자 : ...을 사용해서 배열의 값을 받아오거나 확장시킬 수 있다.
- concat 함수 : 기존의 배열을 수정하지 않고, 새로운 원소가 추가된 배열을 만들어준다.(불변성 유지)
- filter 함수 : 불변성을 유지하면서 배열의 특정 항목 삭제
[출처]
https://ko.reactjs.org/
https://developer.mozilla.org/ko/docs/Web
FRONTEND DEVELOPER