Immer는 JavaScript 객체의 불변성을 유지하면서 간단하게 상태를 업데이트할 수 있는 도구입니다. immerable 함수는 Immer에서 제공하는 메서드로, 클래스나 객체에 불변성을 유지하면서 immer의 업데이트 기능을 적용할 수 있게 해줍니다.

immerable 함수란?

immerable 함수는 객체에 Symbol.immerable 기호를 추가하여 객체가 immer에서 불변성을 유지해야 함을 나타내는 방법입니다. 이러한 표시를 추가하면 Immer는 해당 객체에 대해 immerable을 사용하여 상태를 업데이트할 수 있습니다.

immerable 함수 사용 방법

immerable 함수를 사용하기 위해서는 클래스나 객체에 아래와 같이 Symbol.immerable기호를 추가해주어야 합니다.

import { immerable } from 'immer';

class MyObject {
  constructor() {
    this[immerable] = true;
    this.property1 = 1;
    this.property2 = 2;
  }
}

const myObj = new MyObject();

위의 예시 코드에서는 MyObject라는 클래스에 this[immerable] = true;를 추가하여 immerable 표시를 해주었습니다. 이제 Immer를 사용하여 해당 객체를 업데이트할 수 있게 됩니다.

import produce from 'immer';

const updatedObj = produce(myObj, draft => {
  draft.property1 = 10;
});

위 코드에서는 Immer의 produce 함수를 사용하여 myObj를 업데이트하였습니다. draft는 업데이트를 위한 임시 객체로, 여기에 변경사항을 적용한 뒤 updatedObj로 반환됩니다.

immerable 함수의 장점

immerable 함수를 사용하면 불변성을 유지하는 동시에 훨씬 더 간단한 방식으로 상태를 업데이트할 수 있습니다. 객체가 immerable 플래그를 가지고 있으면 Immer는 내부적으로 불변성을 확인하고 필요한 경우에만 새로운 객체를 생성하여 업데이트합니다. 이는 성능 측면에서도 이점을 가지며, 코드의 가독성과 유지보수성을 향상시킵니다.

#Immer #JavaScript