자바스크립트에서 불변 데이터로 함수 인터페이스 디자인하기

데이터의 불변성은 프로그래밍에서 중요한 개념 중 하나입니다. 불변 데이터는 변경할 수 없는 값을 가지며, 이를 활용하여 코드의 예측 가능성과 안정성을 높일 수 있습니다. 자바스크립트에서 함수를 작성할 때 불변 데이터를 사용하여 함수 인터페이스를 디자인하는 방법에 대해 알아보겠습니다.

1. 객체의 불변성 유지하기

객체는 참조에 의해 전달되므로 객체를 변경하면 해당 객체를 공유하는 다른 함수와 모듈에 예기치 않은 영향을 줄 수 있습니다. 이를 방지하기 위해 객체를 변경하지 않고 불변 상태를 유지해야합니다.

const person = {
  name: "John",
  age: 30
};

// 객체의 불변성을 유지하기 위해 Object.assign()을 사용하여 새로운 객체 생성
const updatedPerson = Object.assign({}, person, { age: 31 });

위의 코드에서는 Object.assign() 메서드를 사용하여 기존의 person 객체를 변경하지 않고, 새로운 updatedPerson 객체를 생성합니다. 이렇게 하면 person 객체의 값은 그대로 유지되며, 변경된 값은 새로운 객체에 반영됩니다.

2. 배열의 불변성 유지하기

배열은 자바스크립트에서 가장 많이 사용되는 데이터 구조 중 하나입니다. 배열을 변경하면 다른 함수와 모듈에 의도치 않은 부작용이 발생할 수 있으므로 불변성을 유지해야합니다.

const numbers = [1, 2, 3, 4, 5];

// 배열의 불변성을 유지하기 위해 배열의 메서드를 사용하지 않고 새로운 배열 생성
const updatedNumbers = [...numbers, 6];

위의 코드에서는 스프레드 연산자를 사용하여 새로운 배열 updatedNumbers를 생성하고, 기존의 numbers 배열을 변경하지 않습니다. 이를 통해 기존 배열의 불변성을 유지하면서 배열에 새로운 요소를 추가할 수 있습니다.

3. 함수 파라미터의 불변성 유지하기

함수의 파라미터는 일반적으로 변경되지 않아야합니다. 따라서 함수 내부에서 파라미터 값을 변경하는 것은 좋은 습관이 아닙니다.

function square(number) {
  // 파라미터의 불변성을 유지하기 위해 새로운 변수에 할당
  const immutableNumber = number;
  return immutableNumber * immutableNumber;
}

위의 코드에서는 함수 내부에서 파라미터인 number를 변경하지 않고, 새로운 변수 immutableNumber에 할당하여 불변성을 유지합니다. 이렇게 하면 함수의 동작을 예측 가능하고 안정적으로 만들 수 있습니다.

결론

자바스크립트에서 불변 데이터를 사용하면 함수 인터페이스를 안정적으로 디자인할 수 있습니다. 객체와 배열을 변경하지 않고 새로운 객체와 배열을 생성하여 불변성을 유지하고, 함수의 파라미터를 변경하지 않는 습관을 갖는 것이 중요합니다. 이를 통해 코드의 예측 가능성과 유지 보수성을 높일 수 있습니다.

참고 자료: