【ITニュース解説】A Factory Reset on Factory Functions

JavaScriptにおけるファクトリー関数について解説する。ファクトリー関数は、同じような構造を持つオブジェクトを大量に生成する際に役立つ。オブジェクトを手動で何度も記述する手間を省き、効率的な開発を可能にする。

まず、オブジェクトの構造を定義する。例えば、ユーザー情報を格納するオブジェクトを考える。

Copy
1const person1 = {
2  firstName: "Mary Jane",
3  lastName: "Watson",
4  age: 23,
5  career: "modeling",
6  hobbies: ["stalking Peter Parker", "partying"]
7}

このオブジェクトを元に、同様のオブジェクトを複数作成する場合、ファクトリー関数を使用すると便利だ。

ファクトリー関数は、新しいオブジェクトを作成し、それを返す関数だ。最初は空のオブジェクトを返すだけの簡単な関数から始める。

Copy
1function factory() {
2  const newObj = {};
3  return newObj;
4}

次に、オブジェクトに格納するデータを受け取るための引数を関数に追加する。

Copy
1function factory(firstName, lastName, age, career, hobbies) {
2  const newObj = {};
3  return newObj;
4}

引数として受け取ったデータを、オブジェクトのプロパティとして設定する。ES6の記法を使うと、プロパティ名と変数が同じ場合、firstName: firstNameのように書く代わりに、firstNameとだけ書くことができる。

Copy
1function factory(firstName, lastName, age, career, hobbies) {
2  const newObj = {
3    firstName,
4    lastName,
5    age,
6    career,
7    hobbies
8  };
9  return newObj;
10}

これで基本的なファクトリー関数の完成だ。この関数を呼び出すことで、指定したデータを持つ新しいオブジェクトを生成できる。

さらに、ファクトリー関数によって生成されるオブジェクトに、共通の関数を追加することもできる。例えば、ユーザーのフルネームと年齢を返す関数をオブジェクトに追加する。

Copy
1function factory(firstName, lastName, age, career, hobbies) {
2  const newObj = {
3    firstName,
4    lastName,
5    age,
6    career,
7    hobbies,
8    full: function() {
9      return `${firstName} ${lastName}, ${age}`;
10    }
11  };
12  return newObj;
13}

ここでは、テンプレートリテラルを使用して文字列を生成している。テンプレートリテラルは、バッククォート( )で囲み、${変数名}で変数の値を埋め込むことができる。従来の文字列結合(firstName + " " + lastName + ", " + age)よりも簡潔に記述できる。

実際にファクトリー関数を使用してみる。

Copy
1const person2 = factory("Peter", "Parker", 23, "photographer", ["rescuing civilians", "preaching the importance of the responsibility that comes with power", "taking selfies"]);
2
3console.log(person2.full()); // logs "Peter Parker, 23"!

person2は、ファクトリー関数によって生成されたオブジェクトであり、指定したデータとfull関数を持っている。

ファクトリー関数は、Webサイトのデータベースにユーザー情報を登録する際など、同じ構造のオブジェクトを大量に生成する場合に非常に便利だ。フォームから入力されたデータを元にオブジェクトを生成し、データベースに保存するといった処理を効率的に行うことができる。

ファクトリー関数を活用することで、コードの重複を避け、保守性を向上させることができる。オブジェクトの構造が変更になった場合でも、ファクトリー関数を修正するだけで、全てのオブジェクトに反映されるため、変更管理が容易になる。