리액트정리하기 2

궁금한점: state가 생명주기가 컴포넌트와달라서 컴포넌트가 재렌더링이되어도 값이남아있는것?

힙메모리에 들어있는거면 다괜찮은건가?

객체는 렌더링되어도 항상남아있을수있나?

 

 

 

1.Map

 

1-1 jsx문법은 for문 사용불가

1-2 모든 배열은 map()사용가능

1-3 부모함수의 모든 자원은 자식함수도 사용가능하다

 

1-5 map의 반환타입은 배열이다

 

 

2.map() 심화

2-1 어레이객체의 필드를 자식함수의 파라미터로 넘긴다

2-2 function() 콜백함수로 부모함수보다 위에쌓인다

2-3 부모객체의 자원을 가져와서 a라는 파리미터로 가져온다

2-4 기본적으로 map은 입력값도 배열이고 반환타입도 배열이다

2-5 a에는 인덱스 0~끝까지 들어간다

2-6 function함수의 반환값을 map함수가 배열에 넣어서 최종반환한다.

 

3.map과 state의 관계

 

3-1 state의 기본자료형은 배열이다

3-2.state에 map()을 붙이면 사용가능하다 배열의 자료값과 인덱스 선택하여 자식함수 파라미터로사용가능

 

4.map을 사용하여 태그를 만들때 주의할점

 

4-1 map으로태그를 반복사용하고 태그에식별자를 주지않으면 리액트가 태그와태그를 구별하지못한다

4-2 태그를 구별하지못하면 특정 태그만 렌더링할수가없다

 

5.for문을 사용해보기

 

5-1 어레이배열객체에 push로 for문을 3번돌린다

5-2 자료형에 안녕태그가 3개가 들어간다

5-3  이제 어레이안에는 배열이 들어간다

 

6. 태그3개에 클릭이벤트 각각넣어보기

 

1.태그3개만듬

2.태그안에 state 출력값넣음

3.각 태그마다 이벤트를 달아준다

4.클릭시 state값을 갈아줘야한다

5.태그마다 클릭시 state를 갈아주되 자신의 해당 index값만 변경한다.

6.태그에도 index를 부여하여 다같이 인덱스 되게하면안된다.