Class Transformerの概要について備忘録を書いた

はじめに

API開発を進めていく中でclassTransformerがかかわってくるところがあったので調べていると日本語記事があまり見つからなかったので備忘録を兼ねてこちらの記事を書くことにしました。
本記事はclass-transformerの説明の導入部分についての記事になります。

自己紹介

はじめまして！
私は2022年4月から現在までCatallaxyという会社でエンジニアインターン生として勤務しているエンジニア志望の大学生です。

class-transformerを理解する前に

JavaScriptには、

• プレーンオブジェクト
• クラスオブジェクト

の2種類があり、これらの違いを知る必要あります。

プレーンオブジェクト

プレーンオブジェクトは、{}を使って作られるオブジェクトのことで例えば以下の配列の各要素に見られるような形になります。（以下の形式は特にJSON形式とも呼ばれます）

users.json

  [
  {
    "id": 1,
    "firstName": "Johny",
    "lastName": "Cage",
    "age": 27
  },
  {
    "id": 2,
    "firstName": "Ismoil",
    "lastName": "Somoni",
    "age": 50
  },
  {
    "id": 3,
    "firstName": "Luke",
    "lastName": "Dacascos",
    "age": 12
  }
]

クラスオブジェクト

クラスオブジェクトはコンストラクターやプロパティ、メソッドを独自に定義したインスタンスのことになります。下のようなUserクラスを定義する際にはclassという文言をあらかじめ宣言します。

export class User {
  id: number;
  firstName: string;
  lastName: string;
  age: number;

  getName() {
    return this.firstName + ' ' + this.lastName;
  }

  isAdult() {
    return this.age > 36 && this.age < 60;
  }
}

生じてしまう問題

以下のように、上記のユーザー情報をプレーンオブジェクトとしてダウンロードして、独自に定義したクラスオブジェクトに変換したいという状況を考えます。

fetch('users.json').then((users: User[]) => {
  ・・・
});

このように書けばusers[0].idやusers[0].firstNameなどのようにプロパティを使うこはできてます。
しかし、ダウンロードしてきたプレーンオブジェクトのままではUserクラスに定義したメソッド（users[0].getName()やusers[0].isAdult()）を使うことができず、実用上不都合が生じてしまいます。

つまり、ここでの問題は、「JSON形式などのようなプレーンオブジェクトを、独自に定義したクラスのインスタンスに変換できないの？」という問題です。

class-transformerによる解決

そこで、class-transformerの出番となります。

fetch('users.json').then((users: Object[]) => {
  const realUsers = plainToClass(User, users);
  ・・・
});

このplainToClass()という関数を用いることでrealUsersという変数に格納された各ユーザーデータは自作のUserクラスのインスタンスとなります。つまり、realUsers[0].getName()やrealUsers[o].isAdult()のようにUserクラスに定義したメソッドを何の不便もなく使えるようになったというわけです。

最後に

API開発を進めるというタスクをする際にclass-transformerというライブラリは非常に有用なライブラリだということを開発を通して実感したので、自分の学びを共有できたら幸甚です。
また、当該ライブラリのplainToClass()関数の詳細についてもう少し調べた記事もかければなと考えております。

参考