JavaScript로 객체의 각 키를 반복하며 하나씩 null로 설정하는 방법

JavaScript에서 객체의 모든 키를 순회하면서 각 반복마다 하나의 키 값을 null로 설정해야 하는 경우가 있습니다. 이럴 때는 Object.keys() 메서드와 for...of 루프를 함께 사용하면 됩니다.

핵심 개념

Object.keys()는 객체가 가진 모든 키를 배열 형태로 반환합니다. 이 배열을 for...of 루프로 순회하면서, 전개 연산자(spread operator)를 활용해 원본 객체를 복사한 뒤 해당 반복의 키만 null로 덮어쓰면 됩니다. 이 방식은 원본 객체를 변경하지 않고 새로운 객체를 생성하기 때문에 불변성(immutability)을 유지할 수 있다는 장점이 있습니다.

예제 코드

다음은 실제 동작하는 코드입니다.

var objectValues = {
  "name1": "John",
  "name2": "David",
  "address1": "US",
  "address2": "UK"
}

for (var tempKey of Object.keys(objectValues)) {
  var inEachIterationSetOneFieldValueWithNull = {
    ...objectValues,
    [tempKey]: null
  };
  console.log(inEachIterationSetOneFieldValueWithNull);
}

실행 방법

위 프로그램을 실행하려면 Node.js 환경에서 다음 명령어를 사용합니다.

node fileName.js

여기서는 파일 이름이 demo294.js라고 가정하겠습니다.

출력 결과

코드를 실행하면 콘솔에 아래와 같은 결과가 출력됩니다. 각 줄을 보면 반복이 진행될 때마다 서로 다른 키가 하나씩 null로 설정되는 것을 확인할 수 있습니다.

PS C:\Users\Amit\javascript-code> node demo294.js
{ name1: null, name2: 'David', address1: 'US', address2: 'UK' }
{ name1: 'John', name2: null, address1: 'US', address2: 'UK' }
{ name1: 'John', name2: 'David', address1: null, address2: 'UK' }
{ name1: 'John', name2: 'David', address1: 'US', address2: null }

정리

이 기법의 핵심은 세 가지입니다. 첫째, Object.keys()로 객체의 키 목록을 배열로 가져오고, 둘째, 전개 연산자(...)로 기존 객체를 얕은 복사하여 원본을 보존하며, 셋째, 계산된 속성명([tempKey]) 문법으로 해당 반복의 키만 null로 지정하는 것입니다. 폼 초기화, 상태 리셋 등 특정 필드만 순차적으로 비워야 하는 상황에서 유용하게 활용할 수 있습니다.