inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

따라하며 배우는 리액트 A-Z[19버전 반영]

리액트 불변성과 splice 메서드 관련 질문

286

hanikim2057

작성한 질문수 2

0

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

 

안녕하세요, 강의 잘 듣고 있습니다!

투두앱 만들기 강의 중 리액트 불변성 관련해서 궁금한 내용이 있어 질문드립니다.

리액트가 가상돔을 생성하여 비교하는 방식으로 렌더링을 최소화하는 방식으로 동작하기 때문에 불변성을 지켜주는 게 필요하다고 이해했는데, 강의 내용 중 드래그 앤 드롭 기능을 구현하면서 기존 배열 자체를 바꾸는(가변적인) splice 메서드를 사용해도 문제없이 동작하는 것에 대해 어떠한 상황에서 가변적인 메서드를 사용해도 좋은 것인지 질문드립니다.

또 불변성을 지켜보려고

const newTodoData = todoData;

부분을

const newTodoData = todoData.map((todo) => todo);

로 바꿔보았는데 이 경우 todoData가 바뀌어서 이후 최적화한 내용이 소용없어지더라구요. 불변성을 지키면서 최적화할 수 있는 방법도 궁금합니다.

typescript tdd react redux Next.js

답변 1

0

John Ahn

안녕하세요.

제가 소스코드를 다시 살펴보니 새로운 todoData를 생성한다고 할 때 그냥

그냥 할당해줘 버렸네요..

새롭게 복사해줄 때는 const newTodoData = [... todoData] 이런 식으로 해주시거나

const newTodoData = todoData.slice(); 혹은 const newTodoData = Array.from(todoData) 이런 식으로 해주시면 됩니다.

좋은 질문 주셔서 감사합니다.

0

hanikim2057

네 감사합니다! 알려주신 방법으로도 해볼게요

강의 소스 코드 압축 풀기 오류

0

90

1

런타임 에러 ㅠㅠ

0

105

1

강의대로 따라갔는데 에러보다 api키로 들어간 넷플릭스? 그런게 렌더링 되지 않습니다 ㅠ

0

114

1

안녕하세요 개발과 상관없는 질문입니다만

0

123

1

리액트 라우터 관련

0

119

1

react-beatiful-dnd에서 문제가 발생합니다.

0

108

1

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

0

833

1

useEffect로 사용을 해도 되나요?

0

210

1

넷플릭스 오리지널 제외하고 슬라이드가 동작을 안합니다.

0

202

1

react 19의 useActionState가 더이상 isPending은 지원하지 않는 듯합니다

0

287

2

리액트 dockderfile 작성 시 COPY 질문

0

156

1

next.js에서부터는 react query 필요없는지

0

327

1

기능

0

204

1

오류가 안보여요

0

206

1

CSS

0

225

1

local storage

0

223

1

list컴포넌트 생성하기

0

230

1

검색어 입력 후 초기화하는 방법 궁금합니다!

0

342

1

Banner.css에 대해서

0

464

1

플러그인이 추천을 안해줍니다

0

334

1

마이너스버튼 테스트

0

285

2

리액트 서버 실행 오류

0

1169

2

오류메세지는 확인했는데 어떻게 고쳐야 할지 모르겠습니다 ㅠ

0

306

1

creactStore질문이요

1

293

2