Javascript 객체의 필드(Key)명 변경하기

개발을 하다가 다음과 같은 문제가 발생했다.

API 호출로 전달받은 JSON 객체에 대문자로 시작되는 필드명이 존재했다. 특정 필드는 대문자로 시작하고, 특정 필드는 소문자로 시작하고 ...

규칙성이 존재하지 않는다. 그리고 대문자로 시작하는 필드명은 옳지 않다고 생각한다! 그래서 필드명의 시작은 모두 소문자로 시작될 수 있게 변경했다.

먼저 객체를 순회하는 방법을 먼저 알아보려고 한다. Object.keys(item) 를 사용하면 객체가 가지고 있는 필드명을 배열의 형태로 반환을 한다.

반복문을 통해 순차적으로 접근하면 해당 객체의 필드명을 알 수 있다. 필드명을 알고 있다면 해당 객체의 값도 알 수 있다. 

 - Key Names : Object.keys(item);

 - Value : item['key name'];

그러나 아래의 coupon 이라는 객체를 보면 객체안에 객체가 존재하고 그 객체안에 또 객체가 존재한다.

그렇기 때문에 객체 내부의 객체까지 탐색하여 필드명을 변경을 해야 한다. 지금과 같은 상황에서 손쉽게 생각할 수 있는 방법은 재귀이다.

물론 재귀가 너무 많다면 스택 오버 플로우 같은 문제가 있을 수는 있겠지만... 그정도로 복잡한 JSON 객체가 있을까?!

재귀가 몇번까지 가능한지 테스트를 해봤다.. 그리고 자바스크립트도 스택 오버 플로우가 존재하는지 궁금해서 테스트 해봤는데.. 존재하고 발생했다.

아래 코드를 보면 손쉽게 이해할 수 있겠지만.. 그렇지 않을 경우 간단한 코멘트를 하자면 ...

재귀함수를 만들 때, 종료조건이 가장 중요하다! 종료조건은 필드의 값이 해당하는 것이 문자열일 때다!

필드에 해당하는 값을 봤을 때, 값이면 필드명을 소문자로 변경하고! 값이 객체이면 내부를 또 탐색할 필요가 있기 때문에 객체(필드의 값)에 대해 다시 함수를 실행한다.

  
        var coupon = {
            "Name" : "couponName",
            "ItemList" : {
                "ItemListName" : "itemListName",
                "InnerItem1" : {
                    "InnerItemName" : "innerItemName",
                    "InnerItemAge" : "innerItemAge"
                },
                "InnerItem2" : {
                    "InnerItemName" : "innerItemName",
                    "InnerItemAge" : "innerItemAge"
                },
                "ItemListAge" : "itemListAge"
            }
        };

        function convertCase(element) {
           var copy = {};
            $.each(Object.keys(element), function(index, item) {
               var newName = item.charAt(0).toLowerCase() + item.substring(1, item.length);
               if(typeof element[item] == 'string') {
                  copy[newName] = element[item];
               } else if(typeof element[item] == 'object') {
                  copy[newName] = convertCase(element[item]);
               }
            });

            return copy;
        }
        console.log(convertCase(coupon));

코드가 이해되지 않는데... 나와 같은 문제가 발생한다면 ... 해당 함수를 그대로 사용해도 된다.

그리고 필드명의 소문자로 변경하는 것이 아닌, 다른 규칙이라면 newName 정의하는 부분만 변경해서 사용하면 된다!! 

결론!! 필드명 생각하고 정의하자!!