[ReactJS] Immutability

불변성: 값이나 상태를 변경할 수 없는 값을 의미 필요한 값을 변형해서 사용하고 싶다면 어떤 값의 사본을 만들어서 사용해야 한다. 리액트는 얕은 비교를 통해 새로운 값인지 아닌지를 판단한 후 새로운 값인 경우 리렌더링을 한다. 얕은 비교란 객체, 배열, 함수와 같은 참조 타입들을 실제 내부 값까지 비교하지 않고 동일 참조(동일한 메모리 값을 사용하는지)를 비교한다. 다음 시나리오를 보면서 왜...

JavaScript불변성ImmerreactjsImmer

JS에서 객체와 배열 복사하기_깊은 복사

그러나, 위와 같이 메소드를 활용한 복사에는 중첩 객체(Nested Object)에서 문제점이 발생한다. ex) 중첩 객체 : 객체 안에 객체, 객체 안에 배열 메소드(assign)을 활용하여 객체를 복사할 경우에는 얕은 복사가 되므로, 중첩된 부분인 깊은 곳까지는 복사가 되지 않는 것이다. 따라서, 객체 obj 와 객체 copy 는 다른 곳을 참조하고 있기 때문에 obj===copy 는 f...

배열불변성객체깊은복사객체

[React] input 값 불변성 지키며 객체로 관리하기

의 와 를 읽고 정리한 글입니다. input 관리하는 방법, 불변성을 지키며 여러 개의 input 객체로 관리하는 방법에 대해 정리했습니다. 사용자에게 이름과 닉네임을 입력받는 예제를 사용했습니다. 컴포넌트에서 보여줘야 하는 내용이 사용자 인터랙션에 따라 바뀌어야 할 때 useState 를 사용할 수 있습니다. Hooks 라는 기능이 도입되면서 함수형 컴포넌트에서도 상태를 관리할 수 있게 되...

Reactinputs객체useStateonchange불변성React

자바 문자열 이거는 알고 쓰자2

String의 내부 값은 변경할 수 없다. 아래 코드에서 immutable 객체를 수정한 것처럼 보이지만, "abcdef"라는 새 객체를 생성한 것이다. String immutable = "abc"; immutable = immutable + "def"; 내부값이 변경 가능한 문자열을 만드려면 StringBuilder 또는 StringBuffer을 사용해야 한다. StringBuffer sb...

StringBufferStringBuilderString불변성String