map2 [React] List 렌더링과 key 리액트에서는 유사한 형태의 여러 데이터를 순회형 데이터로 만들어 간편하게 JSX를 렌더링 할 수 있다. 배열 데이터 렌더링 콘솔에 key prop 에러가 뜬 것을 볼 수 있다. map() 메서드로 렌더링 된 JSX 요소들은 반드시 고유의 key 속성을 가지고 있어야 한다. 이는 추후에 데이터가 삭제, 수정될 때 기존의 순서나 불변 데이터를 올바르게 유지하기 위해 쓰인다. key 값은 같은 map() 메서드로부터 렌더링 되는 배열의 요소들 간에는 고유해야 하나, 다른 데이터나 배열로부터 렌더링 된 JSX 요소의 key 값과는 중복되어도 무관하다. 구조화된 데이터 필터링 데이터에 포함된 값을 key 값에 할당해 주었다. 그 외에 컴포넌트 내에서 uuid (crypto.randomUUID) 등과 같은 값을 생.. 2023. 6. 29. [javascript] 겹치는 구간 찾기 & map의 활용 수직선 상에 A구간과 B구간이 있을 때 두 구간이 겹치는 범위를 출력하는 문제. input은 A구간의 시작점과 종료점, B구간의 시작점과 종료점 순서로 입력되며 두 구간의 공통 부분은 배열로 출력된다. 공통 부분이 없는 경우 X를 출력한다. input output 3 5 7 9 [5,7] 0 10 3 8 [3,8] 7 9 0 3 X 1. 맨 처음 한 것은 주어진 input을 다루기 좋게 잘라 배열에 넣어준 것이다. newarr를 따로 생성한 것은 input이 작은 수 구간부터 차례대로 되어 있지 않아서 (표에서 세 번째 케이스와 같이) 작은 쪽 구간부터 순서를 잡아주려고 newarr를 생성했다. function solution(input) { const mapfn = x => Number(x); var .. 2022. 8. 24. 이전 1 다음