자바스크립트에서 구조체(Struct)를 사용하는 방법

자바스크립트에서 구조체(Struct) 사용하기

C나 C++ 언어에는 데이터를 묶어 관리할 수 있는 구조체(struct)라는 자료형이 기본으로 제공되지만, 자바스크립트에는 이러한 내장 구조체 타입이 없습니다. 그렇다고 해서 구조체를 사용할 수 없는 것은 아닙니다. 생성자 함수(Constructor Function)와 객체를 활용하면 구조체와 거의 동일한 역할을 하는 구조를 손쉽게 만들 수 있습니다.

아래 예제는 필드 이름을 문자열로 전달받아, 해당 이름을 가진 속성을 자동으로 생성하는 구조체형 생성자를 만드는 방법을 보여줍니다.

예제 코드

<!DOCTYPE html>
<html>
   <body>
      <script>
         function displayStruct(str) {
            var str = str.split(' ');
            var count = str.length;

            function constructor() {
               for (var i = 0; i < count; i++) {
                  this[str[i]] = arguments[i];
               }
            }
            return constructor;
         }

         var Item = displayStruct("player country");

         var res = new Item('Sachin', 'India');
         alert("Country: " + res.country);
      </script>
   </body>
</html>

코드 동작 원리

displayStruct(str): 공백으로 구분된 필드 이름 문자열(예: "player country")을 받아 split(' ')으로 배열로 나누고, 필드 개수를 변수에 저장합니다.
constructor 함수: new 키워드로 호출될 때 실행되며, 반복문을 통해 전달된 각 인수(arguments[i])를 해당 필드 이름(str[i])에 순서대로 할당합니다.
this[str[i]] = arguments[i]: 이 한 줄이 핵심입니다. 필드 이름과 값을 동적으로 매핑하여 마치 구조체의 멤버를 정의하듯 객체 속성을 만들어 줍니다.

실행 결과

var Item = displayStruct("player country")로 생성자를 정의한 뒤, new Item('Sachin', 'India')를 호출하면 다음과 같은 객체가 만들어집니다.

{ player: "Sachin", country: "India" }

따라서 alert("Country: " + res.country)가 실행되면 화면에 "Country: India"라는 알림 창이 표시됩니다.

참고: 더 현대적인 대안

위 방식은 구조체의 개념을 이해하는 데 유용하지만, ES6(ECMAScript 2015) 이후에는 클래스(class)나 객체 리터럴을 사용하는 것이 더 권장됩니다. 클래스는 가독성이 뛰어나고 상속 등 객체지향 기능도 함께 활용할 수 있기 때문입니다.

class Item {
   constructor(player, country) {
      this.player = player;
      this.country = country;
   }
}

const res = new Item('Sachin', 'India');
console.log(res.country); // "India"

간단한 데이터 묶음이라면 객체 리터럴 하나면 충분하며, 재사용 가능한 구조가 필요하다면 클래스를 사용하는 것이 좋습니다.