【JavaScript ES6学習】オブジェクトのファクトリ関数(Factory function)

【JavaScript ES6学習】基礎文法編 目次

codecademyで学習したことをまとめています。
プログラミング初心者の私が学習しながら書いた、完全に自分用のメモみたいなものなので、他人が見ると意味不明だったり、間違いがある可能性があるのでご注意ください。

codecademyは無料でかなりのことが学習できる素晴らしいサイトですが、英語です。
なのでこの記事に書かれている日本語の用語も間違っているかもしれません。

今回学習した項目

codecademy
JavaScript
Lesson 8 Factory Functions, Property Value Shorthand

ファクトリ関数の定義方法

似たようなオブジェクトをたくさん作りたい場合、ファクトリ関数(Factory functions)を使うことで、それぞれのオブジェクトを一から定義しなくてすみます。

次のコードはファクトリ関数を定義している例です。

const monsterFactory = (name, age, energySource, catchPhrase) => {
  return { 
    name: name,
    age: age, 
    energySource: energySource,
    scare() {
      console.log(catchPhrase);
    } 
  }
};

( )の中に引数を書き、矢印(=>)で{ }に繋いで、さらにreturnでプロパティ、メソッドが含まれるブロックを返す感じです。

次はファクトリ関数を使用する例。

const ghost = monsterFactory('Ghouly', 251, 'ectoplasm', 'BOO!');
ghost.scare(); // 'BOO!'

constで変数を宣言して、ファクトリ関数を呼び出して代入しています。

ファクトリ関数の省略型(Property Value Shorthand)

以下に示すファクトリ関数では、キーとパラメータが同じです。
同じことを2回も書かないといけないのは面倒くさいですよね。

const monsterFactory = (name, age) => {
  return { 
    name: name,
    age: age
  }
};

そこで、省略形として次のように書くことが出来ます。
意味的には上のコードと同じです。

const monsterFactory = (name, age) => {
  return { 
    name,
    age 
  }
};

【JavaScript ES6学習】基礎文法編 目次

 - PC, ガジェット, プログラミング - JavaScript